diff --git a/libs/design/progress-bar/README.md b/libs/design/progress-bar/README.md index 0b7b0730e4..7bbddb9ad0 100644 --- a/libs/design/progress-bar/README.md +++ b/libs/design/progress-bar/README.md @@ -61,7 +61,7 @@ Use an indeterminate progress bar when the percentage of completion is unknown o ### Colors The default color is `primary`. Use the `color` property to change a progress bar's color. -> `theme`, `white`, and `black` should be used with caution to ensure that there is sufficient contrast. +> `theme`, `light`, and `dark` should be used with caution to ensure that there is sufficient contrast. diff --git a/libs/design/src/core/colorable/colorable.ts b/libs/design/src/core/colorable/colorable.ts index 16c61c4da9..dd95c5c975 100644 --- a/libs/design/src/core/colorable/colorable.ts +++ b/libs/design/src/core/colorable/colorable.ts @@ -35,12 +35,20 @@ export enum DaffColorEnum { Tertiary = 'tertiary', /** - * A light color that does not change based on the theme. + * A light color. + * + * This does not track the theme mode. An element with this color stays light + * in both light and dark mode. Use `Theme` or `ThemeContrast` instead for a + * color that flips with the mode. */ Light = 'light', /** - * A dark color that does not change based on the theme. + * A dark color. + * + * This does not track the theme mode. An element with this color stays dark + * in both light and dark mode. Use `Theme` or `ThemeContrast` instead for a + * color that flips with the mode. */ Dark = 'dark',