Foundations
Gradients
Gradients are used to create the illusion of content fading into an interface or image.
Overview
Gradient foundations consist of both ‘base’ styles (these are dark when used in a light theme and inverse) styles (these are light when used in a dark theme)
Gradients
'Base' gradient tokens are used to fade elements into the interface background.
'Inverse' gradient tokens are used to fade elements into a dark background in a light theme.
| Gradient | Token | Value |
|---|
Accessibility considerations
When using gradients, ensure important UI elements like text and icons are legible without compromising the aesthetic.