Override values for auto-generated color variables

announcements
1

As of v2.3.3 (released early September) you can now override our automatically-generated SASS color variables ($primary-low, $primary-medium, etc) in remote themes (you can not yet do this directly via the admin UI.)

To override one of these colors you need to add it to the color_scheme section of your theme’s about.json file. Once you’ve done that you can see the override listed within your color scheme in /admin/customize/colors.

"color_schemes": {
    “My_colors”: {
      "primary": "000000",
      "primary-high": "333333",
      "primary-medium": "666666",
      "primary-low-mid": "999999",
      "primary-low": “cccccc”
    }
  }

49 AM
49 AM1110×390 12 KB

All of our color transformations are listed in color_transformations.scss. You can also preview the colors generated in our default light color scheme on the https://theme-creator.discourse.org/styleguide/atoms/colors.

To learn more about remote themes check out Structure of themes and theme components and Developer’s guide to Discourse Themes.

32 Likes