> For the complete documentation index, see [llms.txt](https://highfivethemes.gitbook.io/digital-nomad-user-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://highfivethemes.gitbook.io/digital-nomad-user-documentation/custom-settings/accent-background-color.md).

# Accent Background Color

**Digital Nomad** supports customizing the **Accent Background Color** of website blocks (Subscribe CTA banners, tags, buttons, progress bar, etc.).

<div><figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2F6GLarktv8Rgx1Q8eq4ZQ%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.50.39.png?alt=media&amp;token=d23eb862-401b-4de1-9817-1b7e5bba7c32" alt="" width="99"><figcaption><p>Dark Mode Toggle</p></figcaption></figure> <figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FyCG7lAoWZV4gLtxDK9Hb%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.52.09.png?alt=media&amp;token=8b6b33b4-5778-4a2a-9ae6-58b37e971c29" alt=""><figcaption><p>Tags</p></figcaption></figure></div>

<div><figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FXcJ6wTxGY8OdziXhtz5C%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.51.37.png?alt=media&amp;token=1aa3f97f-ee70-41cf-89d9-cb46bfde10d8" alt="" width="180"><figcaption><p>Post Info Widget</p></figcaption></figure> <figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FzIHabFxtE436Mv1zYSJ6%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.50.54.png?alt=media&amp;token=dea970f2-8955-4ca0-ad59-a64e37c7e377" alt="" width="290"><figcaption><p>Sidebar Subscribe CTA Widget</p></figcaption></figure></div>

<figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2Fz63FzB2jdZKNqG009hxa%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.51.56.png?alt=media&amp;token=ba6eb370-f99a-4eaa-bb6f-21e2d3f28c1b" alt="" width="536"><figcaption><p>Post Footer</p></figcaption></figure>

<figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FpdmKzfEVerlcFb5x7anO%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.52.31.png?alt=media&amp;token=e03684f3-0a77-4a0f-9fdc-51a7715c02c6" alt=""><figcaption><p>Subscribe CTA Banner</p></figcaption></figure>

<figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FxNe2ttDs6nJOntucLO5G%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.52.47.png?alt=media&amp;token=91db73ab-6824-4ed2-8c9c-2f0e6e2bc919" alt=""><figcaption><p>Footer Bottom</p></figcaption></figure>

<figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FdbAB7Nptmx0UEnC2ZPrk%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-03-07%20%D0%B2%2014.51.20.png?alt=media&amp;token=d3a3c84d-306e-41fd-8d46-4b8e44c7c0cf" alt=""><figcaption><p>Progress Bar</p></figcaption></figure>

The theme provides CSS variable specifically designed to control the **Accent Background Color**:

```css
--accent-background-color: #F5F5F5;
```

## To customize:

1. Access the **Settings** > **Code Injection** from the admin menu.
2. Click <mark style="color:green;">**Open**</mark>
3. In the provided space, specify the desired **Accent Background Color** using CSS variable. For example:

   ```html
   <style>
        :root {
             --accent-background-color: #F5F5F5;
        }
   </style>
   ```

   <figure><img src="https://456903045-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6cOeGttqHsGsGDEJ7pUf%2Fuploads%2FNke0mUJcLEKT34tla4aS%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202024-02-26%20%D0%B2%2016.05.00.png?alt=media&amp;token=961b1d44-60f6-4791-9ce2-fbb9219c0b4b" alt=""><figcaption></figcaption></figure>
4. Click **Save**
