Add contrast colors to `theme-colors.yml`
See original GitHub issueIn our docs we check for the name of the colors to apply a light or dark color:
https://github.com/twbs/bootstrap/blob/master/site/content/docs/4.3/utilities/colors.md#L33
We could add this to the theme-colors.yml file like this:
- name: primary
hex: "#007bff"
contrast_color: white
- name: secondary
hex: "#868e96"
contrast_color: white
- name: success
hex: "#28a745"
contrast_color: white
- name: danger
hex: "#dc3545"
contrast_color: white
- name: warning
hex: "#ffc107"
contrast_color: dark
- name: info
hex: "#17a2b8"
contrast_color: white
- name: light
hex: "#f8f9fa"
contrast_color: dark
- name: dark
hex: "#343a40"
contrast_color: white
This will be easier to maintain since we don’t have to check for light or warning everywhere.
Issue Analytics
- State:
- Created 4 years ago
- Comments:5 (5 by maintainers)
Top Results From Across the Web
Understanding Themes in Microsoft Office (At Last!) | InformIT
This palette shows 10 theme colors, with lighter and darker ... In contrast, if you apply one of the colors in the Standard...
Read more >How about a theme.color.yml [#3033981] | Drupal.org
I have been looking for a great way to manage color through out a Drupal site, this module looks like it could be...
Read more >themes.yaml - Aesthetic
Provides emphasis and contrast to the primary color. tertiary - Additional complementary color for more variation. neutral - Whites, grays, blacks, etc that ......
Read more >Settings - Material Theme UI Documentation
Contrast Mode: Add contrast to specific panels and components. ... Configure Custom Theme Colors: Open the settings page for the Custom Theme Colors....
Read more >Theme Color | Visual Studio Code Extension API
Theme colors are available as CSS variables in webviews, and an extension is ... an additional border around items across the UI to...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

I’ll have a look at #30044 later.
That or have text-white as a default and only specify the exceptions.