# Site header icons don't use header primary color
**URL:** https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093
**Category:** Bug
**Created:** [February 1, 2019, 6:45am UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093 "2019-02-01T06:45:56Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@fhe](https://meta.discourse.org/u/fhe)
#### Post date: [February 1, 2019, 6:45am UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/1 "2019-02-01T06:45:56Z")
I’ve installed v2.3.0.beta1 and noticed a ux regression.
The site header icons don’t use the header primary color specified in the color scheme:
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [February 1, 2019, 11:16am UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/2 "2019-02-01T11:16:36Z")
@david & @awesomerobot is this related to your report on icons no longer using opacity?
---
### Author:  [@david](https://meta.discourse.org/u/david)
#### Post date: [February 1, 2019, 11:40am UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/3 "2019-02-01T11:40:11Z")
Yes, almost certainly. I’ll add it to the list to fix
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 1, 2019, 3:05pm UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/4 "2019-02-01T15:05:37Z")
There is a fix here, but ultimately the color might be different from where it was before:
**The fix**
I added a new color variable, but was comparing the wrong colors within it.
`$header_primary-low-mid: dark-light-diff($primary, $secondary, 70%, -45%);`
It looked fine in our default themes because the headers use the same colors as the rest of the page, but if the header is dark and the body is light, then you’re going to notice the issue (what @fhe is reporting)
I’ve just updated that to use `$header_primary` and `$header_background` instead of `$primary` and `$secondary`.
* * *
That being said, the colors might be slightly different from what they were before. Here’s why:
**How it worked before**
Previously they used `$header_primary, $lightness: 50` or `$header_primary` along with `opacity: .7`
If you were using a light background in the header, you’d end up with `$header_primary` adjusted to be 50% lighter (which is basically a light grey for our standard light theme).
If you were using a dark background you ended up with `$header_primary` which is just the unaltered color.
How we were treating the color was entirely different based on whether it was a dark or a light background, which isn’t consistent.
**How it works now**
Those icons were updated to use `$header_primary-low-mid`. Which is adjusted to be brighter or darker depending on the header’s background color
The way it behaves now is the same for dark/light themes. On light backgrounds `$header_primary` is lightened to have less contrast and for dark backgrounds `$header_primary` is darkened to have less contrast.
---
### Author:  [@fhe](https://meta.discourse.org/u/fhe)
#### Post date: [February 1, 2019, 3:24pm UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/5 "2019-02-01T15:24:55Z")
Many thanks for looking into this, @awesomerobot!
I did a rebuild and unfortunately, the result is quite different:
The correct coloring using `#FFFFEF` (which is also used for the font in my logo) would be something along
I’ve reported something similar back in December and think it’s related
[https://meta.discourse.org/t/changing-the-color-of-the-header-category-nav/104338](https://meta.discourse.org/t/changing-the-color-of-the-header-category-nav/104338)
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 1, 2019, 3:52pm UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/6 "2019-02-01T15:52:14Z")
Right, so the white you selected is slightly yellow and when it’s darkened the yellow becomes much more prominent.
If you want to override the color you can add some CSS:
```SCSS
.d-header-icons {
.d-icon {
color: #ffffef;
}
}
```
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [February 4, 2019, 12:10am UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/7 "2019-02-04T00:10:02Z")
@awesomerobot should we keep this bug report open? Anything more to do on our side?
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 4, 2019, 3:47pm UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/8 "2019-02-04T15:47:15Z")
I think we’re good here.
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 4, 2019, 3:47pm UTC](https://meta.discourse.org/t/site-header-icons-dont-use-header-primary-color/108093/9 "2019-02-04T15:47:18Z")