Getting Started

Build beautiful UIs with SV5UI

A modern, accessible UI component library built natively for Svelte 5 and Tailwind CSS 4. Ship faster with 49+ production-ready components.

Installation Browse Components

Quick Start

Install and start using sv5ui in two steps.

1. Install the package

Terminal
npm install sv5ui

2. Use components

Welcome

Build beautiful UIs with Svelte 5.

v1.5.1 
<script lang="ts">
  import { Button, Card, Badge } from 'sv5ui';
</script>

<Card>
  <h3>Welcome</h3>
  <p>Build beautiful UIs with Svelte 5.</p>

  <div class="flex gap-2">
    <Button label="Get Started" color="primary" />
    <Badge label="v1.5.1" variant="soft" color="success" />
  </div>
</Card>

Components

49+ components across 8 categories.

General

6

Button, FieldGroup, Icon, Link, Kbd, ThemeModeButton

Layout

3

Card, Container, Separator

Data Display

10

Accordion, Avatar, AvatarGroup, Badge, Chip, Empty, Skeleton, Timeline, User, Table

Forms

13

Checkbox, CheckboxGroup, Input, RadioGroup, Select, SelectMenu, Slider, Switch, Textarea, FileUpload, PinInput, FormField, Form

Feedback

3

Alert, Progress, Toast

Navigation

3

Breadcrumb, Pagination, Tabs

Overlay

9

Collapsible, Command, ContextMenu, Modal, Drawer, DropdownMenu, Popover, Slideover, Tooltip

Date & Time

2

Calendar, RangeCalendar

Built With

Powered by the modern Svelte ecosystem.

Svelte 5

Runes & Snippets

Tailwind 4

Utility-first CSS

bits-ui

Headless primitives

TypeScript

Full type safety

Installation