Experiments

Each experiment is a Storybook story in apps/playground. Run moon run playground:storybook.

Variants and sx contracts

Primitives/Button

Conditional styles, StyleXStylesWithout to block color overrides from callers.

Descendant styles via defineVars

Recipes/OTPInput

Parent hover recolors children through CSS variables. Compare with stylex.when.ancestor.

Dynamic values

Recipes/ProgressBar

Function styles compile to a CSS var + inline style. Checks SSR hydration too.

Theming

Recipes/Theming

createTheme scoped to a subtree; toggle in the header uses the same mechanism.

Third-party: Reshaped

Integrations/Reshaped

CSS Modules library. Wrapped in @layer reshaped via PostCSS; --rs-* tokens bridged with defineVars.

Third-party: Ant Design

Integrations/AntDesign

Runtime CSS-in-JS library. @layer antd for precedence; tokens bridged with defineConsts, not defineVars.

Third-party: Base UI (headless)

Integrations/BaseUI

Unstyled primitives. Styled via [data-checked] conditions and className callbacks. The best-case fit.

loading