Skip to content

Commit 866d75f

Browse files
Apply suggestions from code review
Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com>
1 parent cc8a8cc commit 866d75f

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

website/docs/foundations/colors/partials/guidelines/guidelines.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -85,10 +85,10 @@ Page colors are used for page backgrounds. HDS components do not use these token
8585

8686
We intend to be conformant with WCAG 2.2 Level AA requirements. In terms of color contrast, this means a luminosity ratio of 4.5:1 for normal sized text, and 3:1 for large text (commonly 22px). Further details are outlined on [WCAG’s understanding of Contrast (Minimum)](https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html). By default, semantic color tokens provide accessible color combinations out of the box with their associated naming conventions, while using palette colors requires manual validation, especially if you plan to mix and match. As an example, if a color has a semantic status name in it, then other associated status colors will be accessible.
8787

88-
It is important to note that we [do not recommend the usage of disabled elements](/patterns/disabled-patterns) especially isolating disabled colors out of context, as they are not accessible.
88+
It is important to note that we [do not recommend the usage of disabled elements](/patterns/disabled-patterns), especially isolating disabled colors out of context, as they are not accessible.
8989

9090
### Using palette colors
9191

92-
The Core Palette is available if semantic colors do not meet your needs. These styles are usage-agnostic, which can introduce challenges in consistently scaling designs but allow more freedom and flexibility in color pairing.
92+
The Core Palette is available if semantic colors do not meet your needs. These styles are usage-agnostic, which can introduce challenges in consistently scaling designs but also allow more freedom and flexibility in color pairing.
9393

9494
When pairing colors from the Core Palette, ensure adjacent colors meet accessible contrast ratios. To validate your color combinations, use free tools like the [WebAIM contrast checker](https://webaim.org/resources/contrastchecker/) or [Stark’s Figma plugin](https://www.figma.com/community/plugin/732603254453395948/stark-contrast-accessibility-checker).

0 commit comments

Comments
 (0)