ThemeBuilder
Interactive theme editor.
import { ThemeBuilder } from '@ybouhjira/hyperkit';#Playground
Edit the code — the preview recompiles and re-renders as you type.
Loading preview…
#Props
| Prop | Type | Default | Description |
|---|---|---|---|
initialTheme | Partial<ThemeConfig> | — | — |
onThemeChange | (theme: ThemeConfig) => void | — | — |
onExport | (code: string) => void | — | — |
class | string | — | — |
style | JSX.CSSProperties | — | — |
#Design Tokens
This component reads the following CSS custom properties. Override them globally or per-instance to restyle it — see the CSS Variables guide.
--sk-accent--sk-accent-hover--sk-bg-primary--sk-bg-secondary--sk-bg-tertiary--sk-border--sk-border-subtle--sk-radius-lg--sk-spacing-lg--sk-spacing-md--sk-spacing-sm