# Change hover background color for nav class buttons

**URL:** https://meta.discourse.org/t/change-hover-background-color-for-nav-class-buttons/320801
**Category:** Development
**Created:** [August 8, 2024, 9:20pm UTC](https://meta.discourse.org/t/change-hover-background-color-for-nav-class-buttons/320801 "2024-08-08T21:20:14Z")
**Posts on this page:** 1
**Showing post:** 2

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [August 8, 2024, 9:31pm UTC](https://meta.discourse.org/t/change-hover-background-color-for-nav-class-buttons/320801/2 "2024-08-08T21:31:16Z")

</div>

That topic is outdated, so I’m going to archive it…

If you’d like to change the hover color for these filter buttons above the topic list:

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/d/0/cd0620a60e55cc205229904349e793b03588c1d6.png)

You can do this, since we use some variables:

```css
:root {
  --d-nav-bg-color--hover: #fab1ed; 
}

```

 ![image](https://global.discourse-cdn.com/meta/original/4X/a/3/7/a375cd7aed08dfddff6f534fcacc70c87797ff19.png)

There are a whole set of variables for this nav that can be edited in the same way:

> [@New default nav style and simplified color scheme](https://meta.discourse.org/t/new-default-nav-style-and-simplified-color-scheme/312597/1):
>
> ```plaintext
> :root {
> --d-nav-color: var(--primary);
> --d-nav-bg-color: transparent;
> --d-nav-color--hover: var(--primary);
> --d-nav-bg-color--hover: var(--d-hover);
> --d-nav-color--active: var(--tertiary);
> --d-nav-bg-color--active: transparent;
> --d-nav-border-color--active: var(--d-nav-color--active);
> --d-nav-underline-height: 0.125em;
> }
> 
> ```

For general reference: [Making custom CSS changes on your site](https://meta.discourse.org/t/make-css-changes-on-your-site/168101)

---

_[View the full topic](https://meta.discourse.org/t/change-hover-background-color-for-nav-class-buttons/320801)._