Theme
Nuxt UI component defaults, color modes, icons, and motion — consumed by `@ontopix/nuxt-layer-ui`.
Production
Component defaults, color modes, icons, and motion tokens — one source of truth for @ontopix/nuxt-layer-ui.
What ships
| Surface | What's in it | Lands in |
|---|---|---|
| Component defaults | 18 components, 14 with slot overrides | app.config.ts (runtime) + nuxt.config.ts (build-time) |
| Color modes | 31 semantic colors, 16 UI tokens, 1 global | :root and .dark blocks in ontopix.css |
| Icons | Custom ontopix collection + Nuxt UI icon overrides | nuxt.config.ts icon.customCollections |
| Motion | Duration + easing token families | ontopix.css motion utilities |
Install @ontopix/nuxt-layer-ui and the four surfaces merge into your Nuxt app at build time. No manual copying.
Tour
- Customization — install the layer; override defaults from your app or edit
brand/theme/*.yamlat the source. - Surfaces — background, text, and border tokens.
- Elements — buttons, badges, alerts, cards, avatars, kbd.
- Form — inputs, selects, checkboxes, switches.
- Data — tables, accordions, carousels, timelines, trees.
- Navigation — menus, tabs, breadcrumbs, pagination, steppers.
- Page — heroes, page cards, CTAs, pricing plans, blog posts.
- Motion — duration + easing tokens.
Related
- Customization — install the layer and override defaults from your app or at the source.
- Elements — every Nuxt UI component with an Ontopix variant, live.
- Colors — the palette and semantic tokens the color modes index into.
- Typography — font roles consumed by the theme's typographic defaults.