Theme tokens for Ant / MUI / Fluent / shadcn
Live in demo 74-theme-integrations.
Open the live example: Theme integrations (Themes & Styling)
When
Map your design system's tokens to --sg-* and the grid re-skins.
How
Key API surface:
CSS custom properties only - no JS API
See the demo source for the full implementation; this recipe pins the pattern + the surface so you can copy-paste it confidently. The doc page that explains the underlying feature in depth is linked from the recipes index.
See also
- Demo 74-theme-integrations source
- Demo 74-theme-integrations prompt sidecar - drop into an LLM context window
- Recipes index
Related articles
- SvGrid drops into your shadcn-svelte app - A side-by-side look at how little it takes to swap a hand-written shadcn Table for a full SvGrid - same tokens, same dark mode, plus sorting, filtering, and virtualization for free.
- Using SvGrid with shadcn-svelte - Wire SvGrid's --sg-* CSS tokens to shadcn-svelte's design variables so the grid inherits your app's palette and dark mode automatically - no JavaScript required.