Reference

Package map

How the Themvora packages fit together: what each one is responsible for, what it depends on, who uses it, and what you import. For “which package do I install?”, start with Choose package instead.

Verified with Themvora 2.0.0·Updated September 18, 2026

Generated from the manifests

Every dependency, used-by, peer-dependency and import-path claim on this page is read from the packages' own package.json files by scripts/generate-package-graph.mjs, and every API name is checked against the built package by scripts/verify-package-apis.mjs. Neither can drift silently.

1The shape of the ecosystem

One engine, four layers. Everything above the core is a binding: it translates the core's model into a particular framework's or library's idiom, and adds no theming rules of its own. That is why behavior is identical whether you use React, Vue or no framework at all.

Core — the engine

core

↓bindings over the engine

Framework integrations (10)

angular astro next nuxt react remix solid svelte vue web

UI library adapters (10)

adapters antd bootstrap chakra daisyui mantine mui open-props shadcn unocss

↓tooling runs alongside, not inside

Tooling & build-time

cli devtools tailwind themvora-vscode

2How a theme reaches your UI

The same path every time. The framework integration decides when each step runs — at build time, on the server, or in the browser — which is the entire reason those packages exist.

1
Theme definition
defineTheme(...) — your tokens, or one of the built-in families from getBuiltInThemes().
2
Theme engine
The core runtime resolves the definition (following extends chains), stores the selection, and turns tokens into --theme-* CSS variables.
3
Framework integration
The adapter you installed wraps that runtime in its framework's idiom and handles SSR: resolving on the server, emitting a pre-paint script, and hydrating without a mismatch.
4
Your UI
Components read the variables (or Tailwind utilities, or a UI library's own theme object) and repaint instantly when the selection changes.

3Every package

All 25 published packages, grouped by layer. Each entry lists what it depends on, what depends on it, what to install, what to import, and the APIs you will actually reach for.

Incomplete entries

These packages are in the monorepo but have no editorial entry yet, so their purpose falls back to the manifest description: themvora-vscode.

4. Core

1 package

The engine. Framework-agnostic, dependency-free, and the only package that is not a binding over something else.

@themvora/core

Runtime

Owns the theme model and the runtime. Every other package is a thin binding over this one, so behavior cannot diverge between frameworks.

Version: v1.5.0
Install: npm i @themvora/core
Import path: @themvora/core@themvora/core/config@themvora/core/scrollbar.css@themvora/core/vanilla@themvora/core/vite
Depends on: Nothing — this is the only package with no Themvora dependency.
Used by: adapters angular antd astro bootstrap chakra cli daisyui devtools mantine mui next nuxt open-props react remix shadcn solid svelte tailwind unocss vue web
Works with: No third-party peer dependencies.
Primary APIs: defineThemecreateThemeStorecreateThemeRuntimegetBuiltInThemesthemeToCSSVariablesresolveThemecomposeThemegenerateThemevalidateThemecreateThemeBootstrapScript
Reach for it when: Any app without a framework adapter — plain HTML, a custom renderer, or a server-rendered template
Deriving a light/dark pair from a single seed color at build time
Reading and writing theme state outside a component tree
Source: packages/core ↗

Related: react web cli

5. Framework integrations

10 packages

One per rendering model. Each wraps the core runtime in the idioms of its framework and handles that framework's SSR story.

@themvora/angular

Runtime

Angular integration: providers that wire the runtime into DI, an injectable accessor, and a directive for scoped themes.

Version: v2.1.0
Install: npm i @themvora/angular
Import path: @themvora/angular
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/common@angular/core
Primary APIs: provideThemeinjectThemeThemeScopeDirectiveThemeInspectorComponent
Reach for it when: Angular apps that need theming wired into DI
Scoping a theme to a route or component subtree
Source: packages/angular ↗

Related: core web

@themvora/astro

Runtime + build-time

Astro integration: an Astro integration plus components, with a pre-paint script and SSR-safe CSS templates.

Version: v2.1.0
Install: npm i @themvora/astro
Import path: @themvora/astro@themvora/astro/ThemeFamilySelect.astro@themvora/astro/ThemeInspector.astro@themvora/astro/ThemeScope.astro@themvora/astro/ThemeScrollbar.astro@themvora/astro/ThemeToggle.astro@themvora/astro/client@themvora/astro/provider.astro@themvora/astro/runtime
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: astroreactreact-dom
Primary APIs: themvoraThemvoraInspectorThemvoraScrollbarbuildThemeCssMapcreateBlockingScript
Reach for it when: Astro sites that want zero-flash theming across islands
Static sites where the theme must resolve before first paint
Source: packages/astro ↗

Related: core web

@themvora/next

Runtime + build-time

App Router integration. Resolves the theme on the server, emits a pre-paint bootstrap script, and hydrates without a flash or a mismatch.

Version: v2.1.0
Install: npm i @themvora/next
Import path: @themvora/next@themvora/next/client
Depends on: core react
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: nextreactreact-dom
Primary APIs: ThemeProviderThemeScopeThemeScrollbar
Reach for it when: Next.js App Router apps that need zero-flash SSR theming
Cookie-based theme persistence that is correct on the very first paint
Source: packages/next ↗

Related: react core

@themvora/nuxt

Runtime + build-time

Nuxt module. Registers the runtime, resolves the theme in a server plugin, and handles cookie persistence.

Version: v2.1.0
Install: npm i @themvora/nuxt
Import path: @themvora/nuxt
Depends on: core vue
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: nuxtvue
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: Nuxt apps that need SSR-correct theming and cookie persistence
Keeping a Nuxt app's first paint free of theme flash
Source: packages/nuxt ↗

Related: vue core

@themvora/react

Runtime

React bindings: a provider, hooks, and scoped themes. Adds no theming logic of its own.

Version: v1.4.0
Install: npm i @themvora/react
Import path: @themvora/react
Depends on: core
Used by: next remix
Works with: reactreact-dom
Primary APIs: ThemeProvideruseThemeuseThemeRuntimeThemeScope
Reach for it when: Any React app (Vite, CRA, React Router) that is not Next.js or Remix
Scoping a different theme to a subtree without touching global state
Source: packages/react ↗

Related: core next remix

@themvora/remix

Runtime + build-time

Remix integration: loader-side theme resolution plus a pre-paint script, so the server and client agree from the first byte.

Version: v2.1.0
Install: npm i @themvora/remix
Import path: @themvora/remix@themvora/remix/server
Depends on: core react
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @remix-run/reactreactreact-dom
Primary APIs: ThemeProviderThemeHeadgetInitialThemeStatecreateRemixThemePersistence
Reach for it when: Remix apps where the theme must be decided in a loader
Sharing theme resolution between server and client without duplicating it
Source: packages/remix ↗

Related: react core

@themvora/solid

Runtime

SolidJS bindings built on signals.

Version: v2.1.0
Install: npm i @themvora/solid
Import path: @themvora/solid
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: solid-js
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: SolidJS apps
Fine-grained reactivity over theme state
Source: packages/solid ↗

Related: core web

@themvora/svelte

Runtime

Svelte 5 bindings built on runes.

Version: v2.1.0
Install: npm i @themvora/svelte
Import path: @themvora/svelte
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: svelte
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: Svelte 5 apps and SvelteKit projects
Reactive theme reads in runes-based components
Source: packages/svelte ↗

Related: core web

@themvora/vue

Runtime

Vue 3 bindings: a provider component, composables, and scoped themes.

Version: v2.1.0
Install: npm i @themvora/vue
Import path: @themvora/vue
Depends on: core web
Used by: nuxt
Works with: vue
Primary APIs: ThemeProvideruseThemeuseThemeRuntimeprovideThemeRuntimeThemeScope
Reach for it when: Vue 3 apps and SPAs that are not Nuxt
Composing theme state into existing setup() code
Source: packages/vue ↗

Related: core nuxt

@themvora/web

Runtime

The vanilla runtime and DOM bindings — custom elements, plain scripts, and the shared base the Vue, Svelte, Solid and Angular packages build on.

Version: v1.5.0
Install: npm i @themvora/web
Import path: @themvora/web
Depends on: core
Used by: angular astro solid svelte vue
Works with: No third-party peer dependencies.
Primary APIs: ThemvoraProviderThemvoraScopedefineCustomElementsuseThemeModeuseThemeFamilyuseThemeValue
Reach for it when: No-framework apps, server-rendered templates, and progressive enhancement
Web Components that need to read the active theme
Source: packages/web ↗

Related: core

6. UI library adapters

10 packages

Bridge Themvora tokens into a component library's own theming system, so its components follow your theme without restyling.

@themvora/adapters

Runtime

Shared adapter plumbing — token readers, color maths, and the source resolver every UI adapter builds on. You rarely install it directly.

Version: v1.3.0
Install: npm i @themvora/adapters
Import path: @themvora/adapters@themvora/adapters/react
Depends on: core
Used by: antd bootstrap chakra daisyui mantine mui open-props shadcn unocss
Works with: No third-party peer dependencies.
Primary APIs: readTokenreadColorreadRadiusmixColorsgenerateShadesresolveAdapterSource
Reach for it when: Writing your own adapter for a component library Themvora does not ship one for
Reading Themvora tokens in a framework-agnostic way
Source: packages/adapters/shared ↗

Related: core mui shadcn

@themvora/antd

Runtime

Feeds Themvora tokens into Ant Design's ConfigProvider theme.

Version: v1.3.1
Install: npm i @themvora/antd
Import path: @themvora/antd
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: antdreactreact-dom
Primary APIs: AntdThemeProviderbuildAntdConfigcreateAntdAdapteruseAntdTheme
Reach for it when: Ant Design apps that must follow a Themvora theme
Deriving Ant Design's design tokens from semantic tokens
Source: packages/adapters/antd ↗

Related: adapters react

@themvora/bootstrap

Runtime

Generates Bootstrap 5 CSS variables from Themvora tokens — usable from any framework, not just React.

Version: v2.0.1
Install: npm i @themvora/bootstrap
Import path: @themvora/bootstrap@themvora/bootstrap/angular@themvora/bootstrap/bootstrap.css@themvora/bootstrap/factory@themvora/bootstrap/react@themvora/bootstrap/solid@themvora/bootstrap/svelte@themvora/bootstrap/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createBootstrapAdaptercreateBootstrapVariablesinjectBootstrapCSS
Reach for it when: Bootstrap 5 sites that want Themvora's theme switching
Keeping `--bs-*` variables in step with your semantic tokens
Source: packages/adapters/bootstrap ↗

Related: adapters core

@themvora/chakra

Runtime

Builds a Chakra UI theme from Themvora tokens and provides it to the tree.

Version: v1.3.1
Install: npm i @themvora/chakra
Import path: @themvora/chakra
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @chakra-ui/reactreactreact-dom
Primary APIs: ChakraThemeProvidercreateChakraThemecreateChakraAdapteruseChakraTheme
Reach for it when: Chakra UI apps that need Themvora's runtime and persistence
Mapping semantic tokens onto Chakra's token system
Source: packages/adapters/chakra ↗

Related: adapters react

@themvora/daisyui

Runtime

Generates daisyUI's theme variables from Themvora tokens.

Version: v2.0.1
Install: npm i @themvora/daisyui
Import path: @themvora/daisyui@themvora/daisyui/angular@themvora/daisyui/daisyui.css@themvora/daisyui/factory@themvora/daisyui/react@themvora/daisyui/solid@themvora/daisyui/svelte@themvora/daisyui/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createDaisyAdaptercreateDaisyVariablesinjectDaisyCSS
Reach for it when: daisyUI projects that want Themvora families and persistence
Driving daisyUI's `--p`/`--b1`/… variables from semantic tokens
Source: packages/adapters/daisyui ↗

Related: adapters tailwind

@themvora/mantine

Runtime

Bridges a Themvora runtime into a Mantine theme object.

Version: v1.3.1
Install: npm i @themvora/mantine
Import path: @themvora/mantine
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @mantine/core@mantine/hooksreactreact-dom
Primary APIs: MantineThemeProvidercreateMantineThemeuseMantineTheme
Reach for it when: Mantine apps that need Themvora's families and persistence
Driving Mantine's color scheme from Themvora's mode
Source: packages/adapters/mantine ↗

Related: adapters react

@themvora/mui

Runtime

Builds an MUI theme object from Themvora tokens and keeps the two in sync.

Version: v1.4.0
Install: npm i @themvora/mui
Import path: @themvora/mui
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @emotion/react@emotion/styled@mui/materialreactreact-dom
Primary APIs: MuiThemeProvidercreateMuiThemecreateMuiAdapteruseMuiTheme
Reach for it when: Material UI apps that must follow a Themvora theme
Driving MUI's palette, typography and shape from semantic tokens
Source: packages/adapters/mui ↗

Related: adapters react

@themvora/open-props

Runtime

Maps Themvora tokens onto Open Props custom properties.

Version: v2.0.1
Install: npm i @themvora/open-props
Import path: @themvora/open-props@themvora/open-props/angular@themvora/open-props/factory@themvora/open-props/open-props.css@themvora/open-props/react@themvora/open-props/solid@themvora/open-props/svelte@themvora/open-props/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createOpenPropsAdaptercreateOpenPropsVariablesinjectOpenPropsCSS
Reach for it when: Projects built on Open Props that want Themvora's runtime
Exposing semantic tokens under Open Props' naming
Source: packages/adapters/open-props ↗

Related: adapters core

@themvora/shadcn

Runtime

Maps Themvora tokens onto shadcn/ui's CSS variables, so shadcn components follow your theme untouched.

Version: v2.0.1
Install: npm i @themvora/shadcn
Import path: @themvora/shadcn@themvora/shadcn/angular@themvora/shadcn/factory@themvora/shadcn/react@themvora/shadcn/shadcn.css@themvora/shadcn/solid@themvora/shadcn/svelte@themvora/shadcn/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createShadcnAdaptercreateShadcnVariablesinjectShadcnCSS
Reach for it when: shadcn/ui projects that want Themvora's families and persistence
Keeping shadcn's CSS-variable contract while swapping the token source
Source: packages/adapters/shadcn ↗

Related: adapters tailwind next

@themvora/unocss

Build-time

A UnoCSS preset that exposes Themvora tokens as utilities.

Version: v1.3.1
Install: npm i @themvora/unocss
Import path: @themvora/unocss
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @unocss/coreunocss
Primary APIs: presetThemvoracreateUnoTheme
Reach for it when: UnoCSS projects that want token-driven utilities
Generating utility classes from semantic tokens at build time
Source: packages/adapters/unocss ↗

Related: core tailwind

7. Tooling & build-time

4 packages

Everything that runs outside your app's runtime: the CLI, the devtools inspector, and the Tailwind CSS bridge.

@themvora/cli

Build-time

Generate, validate, inspect, migrate and export themes from a terminal or CI pipeline. Also usable as a library, since each command is exported.

Version: v1.3.1
Install: npm i @themvora/cli
Import path: @themvora/cli
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Primary APIs: cmdGeneratecmdValidatecmdMigratecmdInspectcmdExportExitCodesparseArgs
Reach for it when: Gating a pull request on theme validity
Generating a theme family from a brand seed color in CI
Migrating a theme file written against an older format
Source: packages/cli ↗

Related: core

@themvora/devtools

Runtime

Inspect the live theme at runtime — active tokens, resolved values, and the selection that produced them.

Version: v1.3.1
Install: npm i @themvora/devtools
Import path: @themvora/devtools
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Primary APIs: createDevToolsPanelcreateDevToolsInspectorcreateDevToolsPlugin
Reach for it when: Debugging why a token resolves to an unexpected value
Inspecting scoped themes and inherited tokens during development
Source: packages/devtools ↗

Related: core

@themvora/tailwind

Build-time

Tailwind CSS v4 plugin that publishes Themvora tokens as Tailwind theme variables, plus the dark-mode class helper.

Version: v1.3.1
Install: npm i @themvora/tailwind
Import path: @themvora/tailwind@themvora/tailwind/dark.css@themvora/tailwind/preflight.css@themvora/tailwind/theme.css
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: tailwindcss
Primary APIs: createTailwindPluginthemeCSSsynchronizeDarkClass
Reach for it when: Tailwind v4 projects that want `bg-background`-style utilities driven by semantic tokens
Keeping Tailwind's `dark:` variant aligned with Themvora's mode
Source: packages/tailwind ↗

Related: core shadcn daisyui

themvora-vscode

Runtime

Explore, preview, create and validate your Themvora themes without leaving VS Code.

Version: v0.1.0
Install: npm i themvora-vscode
Import path: themvora-vscode
Depends on: Nothing — this is the only package with no Themvora dependency.
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Source: packages/vscode ↗

4You probably need…

This page explains how the ecosystem fits together. To decide what to install for a specific project, use Which package?.

A React app on Vite or React Router@themvora/core + @themvora/reactRead the guide →A Next.js App Router app with no flash@themvora/core + @themvora/nextRead the guide →Tailwind v4 utilities driven by tokens@themvora/core + @themvora/tailwindRead the guide →shadcn/ui components that follow your theme@themvora/core + @themvora/shadcn (+ tailwind)Read the guide →No framework at all@themvora/core (+ @themvora/web for DOM bindings)Read the guide →Themes generated and validated in CI@themvora/cliRead the guide →

Installing from npm

Every package is published under the @themvora scope ↗. Framework integrations and UI adapters declare the framework as a peer dependency, so you install the framework yourself and npm will not pull a second copy.

Package map

Verified with Themvora 2.0.0·Updated September 18, 2026

Generated from the manifests

1The shape of the ecosystem

Core — the engine

core

↓bindings over the engine

Framework integrations (10)

angular astro next nuxt react remix solid svelte vue web

UI library adapters (10)

adapters antd bootstrap chakra daisyui mantine mui open-props shadcn unocss

↓tooling runs alongside, not inside

Tooling & build-time

cli devtools tailwind themvora-vscode

2How a theme reaches your UI

The same path every time. The framework integration decides when each step runs — at build time, on the server, or in the browser — which is the entire reason those packages exist.

1
Theme definition
defineTheme(...) — your tokens, or one of the built-in families from getBuiltInThemes().
2
Theme engine
The core runtime resolves the definition (following extends chains), stores the selection, and turns tokens into --theme-* CSS variables.
3
Framework integration
The adapter you installed wraps that runtime in its framework's idiom and handles SSR: resolving on the server, emitting a pre-paint script, and hydrating without a mismatch.
4
Your UI
Components read the variables (or Tailwind utilities, or a UI library's own theme object) and repaint instantly when the selection changes.

3Every package

All 25 published packages, grouped by layer. Each entry lists what it depends on, what depends on it, what to install, what to import, and the APIs you will actually reach for.

Incomplete entries

These packages are in the monorepo but have no editorial entry yet, so their purpose falls back to the manifest description: themvora-vscode.

4. Core

1 package

The engine. Framework-agnostic, dependency-free, and the only package that is not a binding over something else.

@themvora/core

Runtime

Owns the theme model and the runtime. Every other package is a thin binding over this one, so behavior cannot diverge between frameworks.

Version: v1.5.0
Install: npm i @themvora/core
Import path: @themvora/core@themvora/core/config@themvora/core/scrollbar.css@themvora/core/vanilla@themvora/core/vite
Depends on: Nothing — this is the only package with no Themvora dependency.
Used by: adapters angular antd astro bootstrap chakra cli daisyui devtools mantine mui next nuxt open-props react remix shadcn solid svelte tailwind unocss vue web
Works with: No third-party peer dependencies.
Primary APIs: defineThemecreateThemeStorecreateThemeRuntimegetBuiltInThemesthemeToCSSVariablesresolveThemecomposeThemegenerateThemevalidateThemecreateThemeBootstrapScript
Reach for it when: Any app without a framework adapter — plain HTML, a custom renderer, or a server-rendered template
Deriving a light/dark pair from a single seed color at build time
Reading and writing theme state outside a component tree
Source: packages/core ↗

Related: react web cli

5. Framework integrations

10 packages

One per rendering model. Each wraps the core runtime in the idioms of its framework and handles that framework's SSR story.

@themvora/angular

Runtime

Angular integration: providers that wire the runtime into DI, an injectable accessor, and a directive for scoped themes.

Version: v2.1.0
Install: npm i @themvora/angular
Import path: @themvora/angular
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/common@angular/core
Primary APIs: provideThemeinjectThemeThemeScopeDirectiveThemeInspectorComponent
Reach for it when: Angular apps that need theming wired into DI
Scoping a theme to a route or component subtree
Source: packages/angular ↗

Related: core web

@themvora/astro

Runtime + build-time

Astro integration: an Astro integration plus components, with a pre-paint script and SSR-safe CSS templates.

Version: v2.1.0
Install: npm i @themvora/astro
Import path: @themvora/astro@themvora/astro/ThemeFamilySelect.astro@themvora/astro/ThemeInspector.astro@themvora/astro/ThemeScope.astro@themvora/astro/ThemeScrollbar.astro@themvora/astro/ThemeToggle.astro@themvora/astro/client@themvora/astro/provider.astro@themvora/astro/runtime
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: astroreactreact-dom
Primary APIs: themvoraThemvoraInspectorThemvoraScrollbarbuildThemeCssMapcreateBlockingScript
Reach for it when: Astro sites that want zero-flash theming across islands
Static sites where the theme must resolve before first paint
Source: packages/astro ↗

Related: core web

@themvora/next

Runtime + build-time

App Router integration. Resolves the theme on the server, emits a pre-paint bootstrap script, and hydrates without a flash or a mismatch.

Version: v2.1.0
Install: npm i @themvora/next
Import path: @themvora/next@themvora/next/client
Depends on: core react
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: nextreactreact-dom
Primary APIs: ThemeProviderThemeScopeThemeScrollbar
Reach for it when: Next.js App Router apps that need zero-flash SSR theming
Cookie-based theme persistence that is correct on the very first paint
Source: packages/next ↗

Related: react core

@themvora/nuxt

Runtime + build-time

Nuxt module. Registers the runtime, resolves the theme in a server plugin, and handles cookie persistence.

Version: v2.1.0
Install: npm i @themvora/nuxt
Import path: @themvora/nuxt
Depends on: core vue
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: nuxtvue
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: Nuxt apps that need SSR-correct theming and cookie persistence
Keeping a Nuxt app's first paint free of theme flash
Source: packages/nuxt ↗

Related: vue core

@themvora/react

Runtime

React bindings: a provider, hooks, and scoped themes. Adds no theming logic of its own.

Version: v1.4.0
Install: npm i @themvora/react
Import path: @themvora/react
Depends on: core
Used by: next remix
Works with: reactreact-dom
Primary APIs: ThemeProvideruseThemeuseThemeRuntimeThemeScope
Reach for it when: Any React app (Vite, CRA, React Router) that is not Next.js or Remix
Scoping a different theme to a subtree without touching global state
Source: packages/react ↗

Related: core next remix

@themvora/remix

Runtime + build-time

Remix integration: loader-side theme resolution plus a pre-paint script, so the server and client agree from the first byte.

Version: v2.1.0
Install: npm i @themvora/remix
Import path: @themvora/remix@themvora/remix/server
Depends on: core react
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @remix-run/reactreactreact-dom
Primary APIs: ThemeProviderThemeHeadgetInitialThemeStatecreateRemixThemePersistence
Reach for it when: Remix apps where the theme must be decided in a loader
Sharing theme resolution between server and client without duplicating it
Source: packages/remix ↗

Related: react core

@themvora/solid

Runtime

SolidJS bindings built on signals.

Version: v2.1.0
Install: npm i @themvora/solid
Import path: @themvora/solid
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: solid-js
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: SolidJS apps
Fine-grained reactivity over theme state
Source: packages/solid ↗

Related: core web

@themvora/svelte

Runtime

Svelte 5 bindings built on runes.

Version: v2.1.0
Install: npm i @themvora/svelte
Import path: @themvora/svelte
Depends on: core web
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: svelte
Primary APIs: ThemeProvideruseThemeThemeScope
Reach for it when: Svelte 5 apps and SvelteKit projects
Reactive theme reads in runes-based components
Source: packages/svelte ↗

Related: core web

@themvora/vue

Runtime

Vue 3 bindings: a provider component, composables, and scoped themes.

Version: v2.1.0
Install: npm i @themvora/vue
Import path: @themvora/vue
Depends on: core web
Used by: nuxt
Works with: vue
Primary APIs: ThemeProvideruseThemeuseThemeRuntimeprovideThemeRuntimeThemeScope
Reach for it when: Vue 3 apps and SPAs that are not Nuxt
Composing theme state into existing setup() code
Source: packages/vue ↗

Related: core nuxt

@themvora/web

Runtime

The vanilla runtime and DOM bindings — custom elements, plain scripts, and the shared base the Vue, Svelte, Solid and Angular packages build on.

Version: v1.5.0
Install: npm i @themvora/web
Import path: @themvora/web
Depends on: core
Used by: angular astro solid svelte vue
Works with: No third-party peer dependencies.
Primary APIs: ThemvoraProviderThemvoraScopedefineCustomElementsuseThemeModeuseThemeFamilyuseThemeValue
Reach for it when: No-framework apps, server-rendered templates, and progressive enhancement
Web Components that need to read the active theme
Source: packages/web ↗

Related: core

6. UI library adapters

10 packages

Bridge Themvora tokens into a component library's own theming system, so its components follow your theme without restyling.

@themvora/adapters

Runtime

Shared adapter plumbing — token readers, color maths, and the source resolver every UI adapter builds on. You rarely install it directly.

Version: v1.3.0
Install: npm i @themvora/adapters
Import path: @themvora/adapters@themvora/adapters/react
Depends on: core
Used by: antd bootstrap chakra daisyui mantine mui open-props shadcn unocss
Works with: No third-party peer dependencies.
Primary APIs: readTokenreadColorreadRadiusmixColorsgenerateShadesresolveAdapterSource
Reach for it when: Writing your own adapter for a component library Themvora does not ship one for
Reading Themvora tokens in a framework-agnostic way
Source: packages/adapters/shared ↗

Related: core mui shadcn

@themvora/antd

Runtime

Feeds Themvora tokens into Ant Design's ConfigProvider theme.

Version: v1.3.1
Install: npm i @themvora/antd
Import path: @themvora/antd
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: antdreactreact-dom
Primary APIs: AntdThemeProviderbuildAntdConfigcreateAntdAdapteruseAntdTheme
Reach for it when: Ant Design apps that must follow a Themvora theme
Deriving Ant Design's design tokens from semantic tokens
Source: packages/adapters/antd ↗

Related: adapters react

@themvora/bootstrap

Runtime

Generates Bootstrap 5 CSS variables from Themvora tokens — usable from any framework, not just React.

Version: v2.0.1
Install: npm i @themvora/bootstrap
Import path: @themvora/bootstrap@themvora/bootstrap/angular@themvora/bootstrap/bootstrap.css@themvora/bootstrap/factory@themvora/bootstrap/react@themvora/bootstrap/solid@themvora/bootstrap/svelte@themvora/bootstrap/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createBootstrapAdaptercreateBootstrapVariablesinjectBootstrapCSS
Reach for it when: Bootstrap 5 sites that want Themvora's theme switching
Keeping `--bs-*` variables in step with your semantic tokens
Source: packages/adapters/bootstrap ↗

Related: adapters core

@themvora/chakra

Runtime

Builds a Chakra UI theme from Themvora tokens and provides it to the tree.

Version: v1.3.1
Install: npm i @themvora/chakra
Import path: @themvora/chakra
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @chakra-ui/reactreactreact-dom
Primary APIs: ChakraThemeProvidercreateChakraThemecreateChakraAdapteruseChakraTheme
Reach for it when: Chakra UI apps that need Themvora's runtime and persistence
Mapping semantic tokens onto Chakra's token system
Source: packages/adapters/chakra ↗

Related: adapters react

@themvora/daisyui

Runtime

Generates daisyUI's theme variables from Themvora tokens.

Version: v2.0.1
Install: npm i @themvora/daisyui
Import path: @themvora/daisyui@themvora/daisyui/angular@themvora/daisyui/daisyui.css@themvora/daisyui/factory@themvora/daisyui/react@themvora/daisyui/solid@themvora/daisyui/svelte@themvora/daisyui/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createDaisyAdaptercreateDaisyVariablesinjectDaisyCSS
Reach for it when: daisyUI projects that want Themvora families and persistence
Driving daisyUI's `--p`/`--b1`/… variables from semantic tokens
Source: packages/adapters/daisyui ↗

Related: adapters tailwind

@themvora/mantine

Runtime

Bridges a Themvora runtime into a Mantine theme object.

Version: v1.3.1
Install: npm i @themvora/mantine
Import path: @themvora/mantine
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @mantine/core@mantine/hooksreactreact-dom
Primary APIs: MantineThemeProvidercreateMantineThemeuseMantineTheme
Reach for it when: Mantine apps that need Themvora's families and persistence
Driving Mantine's color scheme from Themvora's mode
Source: packages/adapters/mantine ↗

Related: adapters react

@themvora/mui

Runtime

Builds an MUI theme object from Themvora tokens and keeps the two in sync.

Version: v1.4.0
Install: npm i @themvora/mui
Import path: @themvora/mui
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @emotion/react@emotion/styled@mui/materialreactreact-dom
Primary APIs: MuiThemeProvidercreateMuiThemecreateMuiAdapteruseMuiTheme
Reach for it when: Material UI apps that must follow a Themvora theme
Driving MUI's palette, typography and shape from semantic tokens
Source: packages/adapters/mui ↗

Related: adapters react

@themvora/open-props

Runtime

Maps Themvora tokens onto Open Props custom properties.

Version: v2.0.1
Install: npm i @themvora/open-props
Import path: @themvora/open-props@themvora/open-props/angular@themvora/open-props/factory@themvora/open-props/open-props.css@themvora/open-props/react@themvora/open-props/solid@themvora/open-props/svelte@themvora/open-props/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createOpenPropsAdaptercreateOpenPropsVariablesinjectOpenPropsCSS
Reach for it when: Projects built on Open Props that want Themvora's runtime
Exposing semantic tokens under Open Props' naming
Source: packages/adapters/open-props ↗

Related: adapters core

@themvora/shadcn

Runtime

Maps Themvora tokens onto shadcn/ui's CSS variables, so shadcn components follow your theme untouched.

Version: v2.0.1
Install: npm i @themvora/shadcn
Import path: @themvora/shadcn@themvora/shadcn/angular@themvora/shadcn/factory@themvora/shadcn/react@themvora/shadcn/shadcn.css@themvora/shadcn/solid@themvora/shadcn/svelte@themvora/shadcn/vue
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @angular/corereactreact-domsolid-jssveltevue
Primary APIs: createShadcnAdaptercreateShadcnVariablesinjectShadcnCSS
Reach for it when: shadcn/ui projects that want Themvora's families and persistence
Keeping shadcn's CSS-variable contract while swapping the token source
Source: packages/adapters/shadcn ↗

Related: adapters tailwind next

@themvora/unocss

Build-time

A UnoCSS preset that exposes Themvora tokens as utilities.

Version: v1.3.1
Install: npm i @themvora/unocss
Import path: @themvora/unocss
Depends on: adapters core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: @unocss/coreunocss
Primary APIs: presetThemvoracreateUnoTheme
Reach for it when: UnoCSS projects that want token-driven utilities
Generating utility classes from semantic tokens at build time
Source: packages/adapters/unocss ↗

Related: core tailwind

7. Tooling & build-time

4 packages

Everything that runs outside your app's runtime: the CLI, the devtools inspector, and the Tailwind CSS bridge.

@themvora/cli

Build-time

Generate, validate, inspect, migrate and export themes from a terminal or CI pipeline. Also usable as a library, since each command is exported.

Version: v1.3.1
Install: npm i @themvora/cli
Import path: @themvora/cli
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Primary APIs: cmdGeneratecmdValidatecmdMigratecmdInspectcmdExportExitCodesparseArgs
Reach for it when: Gating a pull request on theme validity
Generating a theme family from a brand seed color in CI
Migrating a theme file written against an older format
Source: packages/cli ↗

Related: core

@themvora/devtools

Runtime

Inspect the live theme at runtime — active tokens, resolved values, and the selection that produced them.

Version: v1.3.1
Install: npm i @themvora/devtools
Import path: @themvora/devtools
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Primary APIs: createDevToolsPanelcreateDevToolsInspectorcreateDevToolsPlugin
Reach for it when: Debugging why a token resolves to an unexpected value
Inspecting scoped themes and inherited tokens during development
Source: packages/devtools ↗

Related: core

@themvora/tailwind

Build-time

Tailwind CSS v4 plugin that publishes Themvora tokens as Tailwind theme variables, plus the dark-mode class helper.

Version: v1.3.1
Install: npm i @themvora/tailwind
Import path: @themvora/tailwind@themvora/tailwind/dark.css@themvora/tailwind/preflight.css@themvora/tailwind/theme.css
Depends on: core
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: tailwindcss
Primary APIs: createTailwindPluginthemeCSSsynchronizeDarkClass
Reach for it when: Tailwind v4 projects that want `bg-background`-style utilities driven by semantic tokens
Keeping Tailwind's `dark:` variant aligned with Themvora's mode
Source: packages/tailwind ↗

Related: core shadcn daisyui

themvora-vscode

Runtime

Explore, preview, create and validate your Themvora themes without leaving VS Code.

Version: v0.1.0
Install: npm i themvora-vscode
Import path: themvora-vscode
Depends on: Nothing — this is the only package with no Themvora dependency.
Used by: Nothing else in the monorepo depends on it — you install it directly.
Works with: No third-party peer dependencies.
Source: packages/vscode ↗

4You probably need…

This page explains how the ecosystem fits together. To decide what to install for a specific project, use Which package?.

Installing from npm

1The shape of the ecosystem

2How a theme reaches your UI

3Every package

4. Core

@themvora/core

5. Framework integrations

@themvora/angular

@themvora/astro

@themvora/next

@themvora/nuxt

@themvora/react

@themvora/remix

@themvora/solid

@themvora/svelte

@themvora/vue

@themvora/web

6. UI library adapters

@themvora/adapters

@themvora/antd

@themvora/bootstrap

@themvora/chakra

@themvora/daisyui

@themvora/mantine

@themvora/mui

@themvora/open-props

@themvora/shadcn

@themvora/unocss

7. Tooling & build-time

@themvora/cli

@themvora/devtools

@themvora/tailwind

themvora-vscode

4You probably need…

Related documentation

1The shape of the ecosystem

2How a theme reaches your UI

3Every package

4. Core

@themvora/core

5. Framework integrations

@themvora/angular

@themvora/astro

@themvora/next

@themvora/nuxt

@themvora/react

@themvora/remix

@themvora/solid

@themvora/svelte

@themvora/vue

@themvora/web

6. UI library adapters

@themvora/adapters

@themvora/antd

@themvora/bootstrap

@themvora/chakra

@themvora/daisyui

@themvora/mantine

@themvora/mui

@themvora/open-props

@themvora/shadcn

@themvora/unocss

7. Tooling & build-time

@themvora/cli

@themvora/devtools

@themvora/tailwind

themvora-vscode

4You probably need…

Related documentation