> For the complete documentation index, see [llms.txt](https://docs.trydrupal.com/radix/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.trydrupal.com/radix/understanding-radix/bootswatch.md).

# Bootswatch

[Bootswatch](https://bootswatch.com/) is an easy-to-implement Bootstrap theme configurator, you can easily select one of the predefined sets and start from there, to do so all you need is to update your `_variables.scss` file and add the `_bootswatch.scss` to your code.

1. Go to the Bootswatch website, find what theme style you'd like the most, and click on the chevron next to the download as shown below:

<figure><img src="/files/jlN17hQXQKWGmanOwvLJ" alt=""><figcaption><p>Downloading Bootswatch variables</p></figcaption></figure>

2. Paste the content into your own theme `_variables.scss` .
3. Download the `_bootswatch.scss` , place it in `src/scss` and then import it into your `main.style.scss`

{% hint style="info" %}
**Note**: The Bootswatch SCSS will set theme colors and generate corresponding Bootstrap utilities, but it will *not* change anything that's missing a required utility class.

An example of this is the *navbar background*. Bootswatch previews use `.bg-*` utility classes and `data-bs-theme="dark"` to achieve the navbar variations. Replicating this requires modifying your theme's template files accordingly.

For more information, see the [Bootstrap documentation on navbars, color modes, and utility classes.](https://getbootstrap.com/docs/5.3/getting-started/introduction/)
{% endhint %}
