The color palette in the Arctic Design system is divided into different categories, each represented by a specific type called ColorType
. These categories include primary, secondary, success, info, warning, error, and grey. Each color type has a range of shades, from light to dark, defined by numeric keys such as 50, 100, 200, and so on, up to 900. This ensures a consistent gradient for each color, allowing for flexible usage across different UI elements.
In addition to these colors, the system includes a neutral color type defined by NeutralColorType
. The neutral color is represented by two values: 0
for the lightest shade and 1000
for the darkest shade, providing a balanced contrast between light and dark neutral tones within the system.
This structure ensures a consistent and cohesive visual identity throughout the design system while maintaining flexibility in color usage.
@arctic-kit/colors
package offers a variety of additional color shades. Below is a list of the available shades.