• v3.2.0 — SvelteKit 2.x Ready

Ship Svelte Apps at Scale

Drop-in UI primitives that compile away. Zero runtime overhead, full reactivity, and seamless SvelteKit integration.

npm install @webui/svelte

Built for the Svelte Compiler

Webui components are designed to leverage Svelte's compile-time reactivity, not fight against it.

Compiler-Optimized

Components are flattened at build time. No virtual DOM diffs, no runtime framework code. Just pure DOM updates.

•

Reactive Stores

First-class support for Svelte stores. Sync UI state, form data, and preferences with zero boilerplate.

SSR/SSG Ready

Zero waterfalls. Fully compatible with SvelteKit's server-side rendering and static site generation pipelines.

Svelte 4 / TypeScript

                        // Dashboard.svelte

                        import { Card, Button, Metric } from '@webui/svelte';

                        import { stats } from './store';

                        export let refresh: () => Promise<void>;

                        <Card class="dashboard-panel">

                          <h2>Active Sessions</h2>

                          <Metric value={$stats.active} trend="+14%" />

                          <Button variant="primary" on:click=refresh>

                            Sync Data

                          </Button>

                        </Card>

Integration Workflow

Three steps to replace your entire UI layer.

Install & Configure

Add the package and extend your Tailwind or CSS variables. Webui auto-detects your SvelteKit project structure.

Import Primitives

Replace custom components with @webui/svelte exports. They accept standard Svelte props and events.

Build & Deploy

Run your standard build command. Webui strips all framework code at compile time, leaving only optimized DOM instructions.