# @wrksz/themes

- [Getting Started](/docs): Install and configure @wrksz/themes in your Next.js app.
- [Agent integration guide](/docs/agents): Import choices, integration patterns, migration checks and troubleshooting for coding agents.

- **API**
- API Reference: Complete API reference for @wrksz/themes.
  - [ThemeProvider](/docs/api/theme-provider): API reference for the ThemeProvider component.
  - [ClientThemeProvider](/docs/api/client-theme-provider): Theme provider for use inside Client Components.
  - [createThemes](/docs/api/create-themes): Typed factory for ThemeProvider and theme hooks.
  - [useTheme](/docs/api/use-theme): Hook for reading and updating the current theme.
  - [useThemeEffect](/docs/api/use-theme-effect): Side-effect hook that reacts to theme changes.
  - [useThemeValue](/docs/api/use-theme-value): Hook that returns a value from a map keyed by the current resolved theme.
  - [ThemedImage](/docs/api/themed-image): Component that displays the correct image for the current theme.
  - [getTheme](/docs/api/get-theme): Read the current theme from a cookie outside React - in proxy, layouts, or server actions.

- **Examples**
- Examples: Integration examples for common use cases.
  - [Tailwind CSS](/docs/examples/tailwind): Using @wrksz/themes with Tailwind CSS v4 dark mode.
  - [Other React frameworks](/docs/examples/framework-agnostic): First-paint theming in TanStack Start, Remix, and other SSR frameworks.
  - [Hydration, consent, and no-JS](/docs/examples/hydration-and-consent): Render theme controls safely and choose when preferences may be persisted.
  - [Typed themes](/docs/examples/typed-themes): Define your theme tuple once and get typed providers, hooks, values, and images.
  - [System variants and contrast](/docs/examples/system-variants): Resolve custom variants and model independent accessibility preferences.
  - [Data attribute](/docs/examples/data-attribute): Applying themes via data attributes instead of CSS classes.
  - [Scoped theming](/docs/examples/scoped-theming): Apply independent themes to different sections of your app simultaneously.
  - [Shadow DOM](/docs/examples/shadow-dom): Theme a ShadowRoot host from the opt-in extended client provider.
  - [Forced theme](/docs/examples/forced-theme): Force a specific theme on a page or section, ignoring user preference.
  - [Hybrid storage](/docs/examples/hybrid-storage): Use cookies for SSR and localStorage for cross-tab sync.
  - [Server-provided theme](/docs/examples/server-theme): Eliminate SSR theme flash with cookie storage or a custom server-side source.
  - [Meta theme-color](/docs/examples/meta-theme-color): Update the browser theme color on theme change for Safari and PWAs.

- **More**
- [Migrating from next-themes](/docs/migration): Step-by-step guide for migrating from next-themes to @wrksz/themes.
- [Why not next-themes?](/docs/why-not-next-themes): A comparison of @wrksz/themes and next-themes.

## Agent starting points

- [Integration patterns and troubleshooting](https://themes.wrksz.dev/llms.mdx/docs/agents)
- [Migration from next-themes and 1.x](https://themes.wrksz.dev/llms.mdx/docs/migration)

The installed package includes AGENTS.md. Check its version and declarations before applying online examples.