# Getting Started > Install and configure kuzan in your Koze application Package: Kuzan Canonical: https://kuratchi.dev/docs/kuzan/getting-started Markdown: https://kuratchi.dev/docs/kuzan/getting-started.md ## Installation ```bash npm install @kuratchi/kuzan ``` `kuzan` is a regular package — there is no framework-level wiring. Three steps to get a styled app: import the theme stylesheet, set the initial color scheme on ``, and (optionally) drop in the theme-init script. ## Add the theme stylesheet Import `kuzan/styles/theme.css` from your global stylesheet at `src/app.css`: ```css /* src/app.css */ @import '@kuratchi/kuzan/styles/theme.css'; ``` Koze auto-discovers `src/app.css`, runs every Vite CSS plugin on it, and injects `` into your app shell — you don't write the `` tag. ## Set the initial color scheme Pick a default by setting a class on `` in your layout: ```html ``` Use `class="dark"` for dark mode, omit the class for light mode. The runtime can override this on first paint via the theme-init script (next section). ## Initialize theme (optional) To prevent flash of unstyled content (FOUC) when using theme persistence, add `` to the layout's ``: ```html My App ``` `` reads the saved theme from `localStorage['kui-theme']` and applies it before the page renders. ## Using components Import components as `.koze` files in your route scripts: ```html

Welcome

This is an informational alert.

Start building with Koze UI components.

Active ``` ### Component props Components accept props via the `props` object. Use underscores for data attributes: ```html Live Content here ``` Common props: - `class` — Add custom CSS classes - `data_variant` — Style variant (e.g., `"primary"`, `"danger"`, `"success"`) - `data_size` — Size variant (e.g., `"sm"`, `"lg"`) - Boolean data attributes (e.g., `data_compact`, `data_dismissible`) ## Semantic HTML defaults `kuzan` styles semantic HTML elements, so you can build UIs without component imports: ```html

Dashboard

Overview of your application

``` Styled elements include: - `
` — Page container with max-width and padding - `
` — Sticky app header or page header - `
` — Card-like container with border - `
` — Row inside a section - `