Svelte 5 Runes · Bits UI Primitives · Tailwind Variants · Tailwind CSS v4

The Intuitive Svelte UI Library for Fast Teams

50+ accessible components powered by Bits UI & Tailwind Variants. Includes AI chat primitives, native SVG charts, solo SaaS workflows, and the real-time Visual Web Theme Studio.

Live Tailwind CSS v4 Theme Studio

Customize Every Dimension in Real Time

Watch components and typography adapt instantly across the entire page with pure CSS variables.

1. Primary Accent svelte
2. Neutral Undertone zinc
3. Typography Family sans
4. Corner Radius
5. Density Scale

Live Sandbox Preview

Reacting to active palette & radius tokens

Live State
Live Deploy
Connected
Pending
// Active CSS Variables:
--yaxa-primary: #ff3e00
--radius: 0.5rem
Architectural Pillars

Why Yaxa for SvelteKit?

Modern web development primitives built specifically for solo developers who value velocity and DX.

Pure Svelte 5 Runes Native

Zero legacy store baggage. Svelte 5 runes reactivity (`$state`, `$derived`, Snippets) with SSR leak-proof class state containers and direct composables (`useToast()`, `useGate()`).

Dynamic OG Card Engine

Zero-dependency runtime SVG OpenGraph image generator (`/api/og`). Generates pixel-perfect social preview cards at the edge without heavy canvas binaries.

Automated Robots & Sitemaps

Mount `createYaxaHook(siteConfig)` in `src/hooks.server.ts` to get environment-aware robots.txt, XML sitemaps with human-readable XSL dashboards, and webmanifests.

Tailwind Variants & CSS v4

Type-safe variant matrices via `tv()`, conflict-free class merging, CSS `@theme` variables, and harmonic radius scaling without JavaScript theme objects.

Bits UI Accessible Primitives

WAI-ARIA compliance, keyboard navigation, focus management, and collision-aware floating positioning under the hood for every overlay and picker.

Ultra-Lean Runtime (Only 2 Deps)

Only 2 direct production dependencies (`bits-ui` + `tailwind-variants`). Zero bloat, zero runtime CSS conflicts, and ultra-fast SSR hydration.

Production Ready

Start Building Faster with Yaxa

Supercharge your SvelteKit development with accessible Tailwind CSS components and automated SEO parity.