Component Showcase

UI components powered by shadcn-svelte. Install more from shadcn-svelte.

Buttons

Buttons for every occasion.

Button Variants

Button Sizes

Form Components

Input fields and form controls.

Current value: Empty

Current value: Empty

Current value: Empty

Selected: option1

Switch Components

Toggle switches for enabling or disabling features.

Notifications are disabled.

Badge Components

Badges for highlighting statuses or categories.

Default Secondary Outline Error Success
Tabs Components

Organize content with interactive tabs.

Tab 1 Content

This is the first tab's content.

Use tabs to switch between different sections of content without reloading the page.

Card Components

Content containers with headers and actions.

Sample Card

Example card with content and actions.

Cards organize related information into sections.

Another Card

Cards support various content types.

Progress 75%
Alert Components

Status messages and notifications.

Layout Components

Visual separators and dividers.

Horizontal Separator

Content above separator

Content below separator

Vertical Separator

Left content Right content
Responsive Grid Layout

Mobile-first grid system.

Column 1

Responsive grid item

Column 2

Responsive grid item

Column 3

Responsive grid item