vivatura Design System

Shared design system stack:

• Fractal for component documentation and previews
• Tailwind CSS for styling
• Vite for asset builds

Local Development

1. Install dependencies: npm ci
2. Start dev mode: npm run dev

npm run dev starts both processes:

• vite build --watch for CSS/assets in dist/assets
• fractal start --sync for the Fractal UI

Note: The Fractal preview wrapper loads the built CSS via ../style.css.

Build

• npm run build builds Vite assets first, then static Fractal docs.
• Static Fractal output is written to dist/docs.