Product colors are selected to adhere to the Feather DS principles. Aiming to comply with AA standards at a minimum, we aim to choose user-focused and meaningful colors that will help pinpoint exactly what people need to see.
Extended palettes help to define our color theming for Feather DS. For the example below, two colors were chosen from a brand palette and expanded to include values from 1000 to 50. This ensures consistency from dark to light mode, as well as adhering to AA contrast standards.
Theming will consist of 4 brand centric colors - primary, primary variant, secondary and secondary variant. These colors are derived from the extended palette. Colors are also specified for background, surface, on color, on background, and on surface.
To get started using our theme, import
@featherds/styles directly. For more information on getting started, visit our guides for theming section.