Davaux UI

An SSR-first component library for Davaux. Mantine-inspired design tokens, every component renders to plain HTML with zero required client JavaScript.

Installation

npm install @davaux/ui

Import the stylesheet once in your root layout, then use any component directly in your pages or layouts.

// src/routes/_layout.tsx
import '@davaux/ui/styles.css'
import { Button } from '@davaux/ui'

export default defineLayout(({ children }) => (
  <html>
    <body>
      <Button>Hello</Button>
      {children}
    </body>
  </html>
))

Optional: prose layer

Add @davaux/ui/prose.css and apply class='dv-prose' to any container to style raw HTML output from MDX or markdown renderers.

import '@davaux/ui/prose.css'

<article class='dv-prose'>{children}</article>

Live examples

New
Alpha
Stable
Deprecated

Design philosophy

  • SSR-first — every component renders to a plain HTML string via Promise<string>. No hydration required.
  • Design tokens — all styles use --dv-* CSS custom properties. Override the primary color or any token in a single :root block.
  • Mantine-inspired — familiar prop API (variant, size, color, radius) so the mental model is immediately recognisable.
  • Islands-optional — interactive components (Modal, Drawer, Select…) ship as island stubs. Only those that need client JS ship any JavaScript.

Read the introduction →