Build stunning UIs in record time
42+ accessible components for Svelte 5, built on bits-ui and styled with Tailwind CSS 4. Fully typed, dark mode ready.
Everything you need, nothing you don't
A thoughtfully designed component library with the building blocks for any application.
Svelte 5 Runes
Built from the ground up with Svelte 5 runes, snippets, and the latest reactivity model.
42+ Components
From buttons to calendars, modals to data tables. Everything you need for production apps.
Fully Accessible
Built on bits-ui with WAI-ARIA patterns. Keyboard navigation and focus management included.
Tailwind CSS 4
Styled with Tailwind CSS 4 utilities. Customize every component through the ui prop.
OKLCH Colors
8 semantic color scales using the perceptually uniform OKLCH color space, dark mode ready.
Fully Typed
100% TypeScript with exported types for every component. Autocomplete out of the box.
Up and running in 3 simple steps
No complex configuration. Install, import, build.
Install the package
npm install sv5uiSet up your styles
@import 'tailwindcss';
@import 'sv5ui/theme.css';
@custom-variant dark (&:where(.dark, .dark *));Start building
<script lang="ts">
import { Button, Card } from 'sv5ui';
</script>
<Card>
<Button variant="solid" color="primary">
Hello SV5UI!
</Button>
</Card>