# Custom theme

Streams Manager offers the ability to fully customize your theme as part of the premium feature pack. This allows you to create a fully custom theme with custom color and layout but you need to be familiar with CSS.

## Creating your custom theme

It may be easiest to start with an existing Bootstrap 4 theme (system is build on Bootstrap 4 so maximum version of Bootstrap that is supported is 4) and modify from there, but that is completely up to you. You can find Bootstrap 4 themes at: <https://bootswatch.com/4> and many other places on the Internet. We also have a dark theme with blue nav bar that you can use as a starting point that is based on Darkly bootswatch theme: <https://bootswatch.com/4/darkly/> and you can get it [here](https://api.streamsmanager.com/css/darkly.css). Alternatively, you can try create a completely custom theme with the help of [https://www.bootstrap-live-customizer.com](https://www.bootstrap-live-customizer.com/). Modify the theme as you see fit and save the file somewhere on your computer

## Testing your custom theme

Follow these steps to see how your custom CSS theme looks before uploading it. Steps below work for Chrome browsers but other browsers work similarly.

* Store your custom CSS file in a folder that is accessible by your user
* Open your Stream Manager site in a browser
* Open developer tools
* Right click anywhere on the page and select Inspect
* Click on the Elements tab
* Expand head element and find client theme link element
*

```
<figure><img src="https://1028607433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9BkTOk434ezw65fP9EYl%2Fuploads%2FgIxPEJv49loPLUzjL78t%2Fimage.png?alt=media&#x26;token=5946b6b1-ffa8-4fa2-8db6-ee9f16674823" alt=""><figcaption></figcaption></figure>
```

* Replace the `href=` portion with `file:///full-path-to-css-file` using the full path to your CSS file (i.e. `file:///C:/Users/Admin/Downloads/my.css`)
* Press enter and your changes should be reflected

## Upload your custom theme

{% hint style="warning" %}
Please note that because CDN caches the file, it may take 6 hrs for changes to take effect.
{% endhint %}

To see how the theme looks, upload the CSS file in `Settings -> Custom Content -> Custom CSS` section and fully reload the page. You can also reset the theme to default if something is not looking right.