# Choosing between dark and light colors in a theme component

**URL:** <https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241>\
**Category:** Support\
**Created:** [February 18, 2021, 6:55pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241 "2021-02-18T18:55:57Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![Lumi](https://avatars.discourse-cdn.com/v4/letter/l/b38774/32.png) [@Lumi](https://meta.discourse.org/u/Lumi)\
**Post date:** [February 18, 2021, 6:55pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/1 "2021-02-18T18:55:57Z")

</div>

I have a theme component with different colors for dark and light themes. I have been using dark-light-choose function to choose between the light and dark colors, but it is no longer working after the color variable update. Specifically dark-light-choose always returns light color for the theme component, even if a dark color scheme has been selected. Here’s a short example: if I put

```
$d-color: dark-light-choose(#fff, #000);

:root {
  --d-color: #{$d-color};
}

```

in color definitions and

```
.d-header {
  background: var(--d-color);
}

```

in common, I will always end up with a white header regardless of the color scheme in use. Any ideas why this is not working?

---

_[View the full topic](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241)._