Skip to content

Solid

@theme-kit/solid

SolidSignals6 exports

Solid provider, signals and scopes with fine-grained reactivity.

Install the integration alongside @theme-kit/core.

bash
pnpm add @theme-kit/solid

Quick Start

Complete copy-paste usage for this package.

App.tsx
tsx
1import { ThemeProvider, useTheme } from "@theme-kit/solid";
2
3function App() {
4  return (
5    <ThemeProvider themes={themes}>
6      <Switcher />
7    </ThemeProvider>
8  );
9}
10
11function Switcher() {
12  const theme = useTheme();
13  return (
14    <button onClick={() => theme.toggleTheme()}>
15      {theme.theme().name} · {theme.mode()}
16    </button>
17  );
18}

API Reference

Curated highlights below. The complete generated reference — every signature, parameter and type — is at /api-reference/solid.

Provider

ExportDescription
ThemeProviderContext provider with bindings.
useThemeSignals for theme, mode and family with getters.

Hooks

ExportDescription
useThemeHistory / useThemeBatchHistory and batching.
useThemeSnapshot / useThemeRestoreSerialize / restore.
useThemeLifecycle / useThemePacksEvents and packs.

Components

ExportDescription
ThemeScopeScoped theming.
@theme-kit/solid — Theme Kit