Token tuned
Components inside the provider read the same CSS variables.
Controls
Theming
SwirskiProvider
Theme provider for Swirski tokens, color schemes and per-app brand overrides.
Component
13
Import
import { SwirskiProvider, createSwirskiTheme } from "@swirski/ui";Playground
Usage
const theme = createSwirskiTheme({
colorBlue: "#0057FF",
colorYellow: "#FFD400",
colorShadow: "#0B0B0C",
});
<SwirskiProvider theme={theme}>
<Button>Theme button</Button>
</SwirskiProvider>Props
| Prop | Type | Default | Notes |
|---|---|---|---|
childrenRequired | ReactNode | - | Generated from SwirskiProviderProps. |
colorScheme | 'light' | 'dark' | "light" | Selects the default light or dark token set. |
theme | SwirskiTheme | - | Overrides any Swirski token or adds custom CSS variables. |
createSwirskiTheme | (theme: SwirskiTheme) => SwirskiTheme | - | Small helper for typed theme objects. |
useSwirskiTheme | () => SwirskiThemeTokens | - | Reads the resolved theme inside React components. |