Reset Theme

The stylex.defineVars function is used to create a set of CSS variables, called VarGroups. Further, the stylex.createTheme function can be used to create Themes, that override the values of the variables defined within VarGroups.

Many VarGroups can be defined which can then be independently overridden with Themes. However, Themes for the same VarGroup are mutually exclusive and do not merge. Any variable in a VarGroup that is not explicitly overridden in a Theme for that VarGroup is set to its default value.

This characteristic of Themes can be used to define a "empty" theme that resets all variables to their default values.

Example

import * as stylex from '@stylexjs/stylex';
import { vars } from './variables.stylex';

export const resetVars = stylex.createTheme(vars, {});