
THEME SPECTRUM
Theme Spectrum is built to support theming. Colors, sizing, and spacing options can be customized through the use of CSS variables which are defined using the Provider component. Themes consist of variable definitions for light and dark color schemes, along with medium and large platform scales. Themes can also be nested to allow different parts of an application to adopt a different appearance.
What the important
React Spectrum supports multiple color schemes within a theme, including light and dark mode.
What the System
By default, React Spectrum automatically switches between color schemes according to the operating system setting using the prefers-color-scheme media query.
Fast work turnaround
React Spectrum components will update accordingly.r.

We recommend that all React Spectrum applications support both light and dark mode
Branding
All React Spectrum components adapt to color scheme out of the box. See the styling page for details on how to use Spectrum color variables in your own custom components.


“What is the point of being alive if you don’t at least try to do something remarkable?”
JANET MORRIS

“What is the point of being alive if you don’t at least try to do something remarkable?”
WILLIE BROWN

“What is the point of being alive if you don’t at least try to do something remarkable?”
SEAN FISHER