Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Gray10 Colors don't match docs

See original GitHub issue

The color for $text-02 does not match what is documented in the Carbon design website for Gray10.

4: @debug($text-01);
5: @debug($text-02);
6: @debug($text-03);

colors.scss:4 DEBUG: #161616
colors.scss:5 DEBUG: #525252
colors.scss:6 DEBUG: #a8a8a8

We are using Gray10 and text-02 is supposed to be #393939 but #525252 is returned and that is not text-02 on any theme.

This is causing a readability issue and not enough contrast for elements using it. We saw this with text-02, but not sure if others have same issue.

    "carbon-components": "^10.15.0",
    "carbon-components-react": "^7.15.0",
    "@carbon/themes": "^10.14.0",

Aspera

Issue Analytics

State:
Created 3 years ago
Comments:12 (6 by maintainers)

Top GitHub Comments

1reaction

andreancardonacommented, Jul 15, 2020

@dabrad26 From what I can see the documentation is wrong!

I’ll update the hex code now 😃

https://www.carbondesignsystem.com/guidelines/color/usage

Screen Shot 2020-07-14 at 7.36.34 PM.png

0reactions

dabrad26commented, Jul 14, 2020

Thank you.

These are all large products being migrated from older pre-ibm and as they become more mature in carbon10 it won’t matter as much. But as of now we are testing carefully as we add stuff and the color mismatch caught us off guard and we spent so much time trying to find why it didn’t match.

Thanks for getting the docs updated. We shared that link with all of our devs for reference. Some feedback: it would be nice if we could have a query or hash that went straight to gray10 since some devs don’t change it and go by the first page. 😦

Top Results From Across the Web

Using color | U.S. Web Design System (USWDS)

Throughout our documentation and guidance, we'll use the terms “color,” ... A magic number of 70+ results in WCAG 2.0 AAA contrast (example:...

Color | Brand Manual - The University of Iowa

Every effort should be made by vendors to match the PMS 116 C swatch. ... Tints and shades of these colors should not...

Color [color] - Google Merchant Center Help

Use the color [color] attribute to describe your product's color. This information helps create accurate filters, which customers can use to narrow search ......

Match colors in your image - Adobe Support

The Match Color command matches colors between multiple images, between multiple layers, or between multiple selections.

Colors in R - Department of Statistics - Columbia University

This wonderful R colors cheat-sheet was created by. Dr. Ying Wei ... that contains a list of R colors. ... color name gray8...