Parts that work. Themed in minutes.

130 components and six product kits from the system that draws Varial itself. Ship them in any stack.

See pricing

Six kits. Ready to theme.

Each kit is a complete surface built from the library: real layout, real states.

  1. Assets, a canvas, and an inspector, laid out the way creative tools work.

  2. KPI rails, charts, and filters for a command center your team reads every morning.

  3. Threads, tool calls, citations, and a prompt bar for agent products.

  4. Tables, permissions, and bulk actions for the back office.

  5. Editorial queues, statuses, and scheduling in one surface.

  6. Logs, traces, and health for engineering teams.

130 components. Every one is live.

Each cell runs the library's own markup and styles, right here. It follows the site theme.

  • Command paletteOverlay
  • BadgePrimitive
  • InputForm
  • Kanban boardWorkflow
  • File uploadForm
  • Keyboard keysPrimitive
  • ButtonPrimitive
  • Data gridData
  • One-time codeForm
  • Mini calendarDate
  • PillPrimitive
  • Price blockCommerce

Hand off clean code. Any stack.

Tokens as CSS variables, components as plain HTML with a headless runtime, adapters for the rest.

import '@varial/ui-styles/dist/output.css'
import { initVarialUI } from '@varial/ui-runtime/html-adapter'

// Wires keyboard, focus, and state for every component on the page.
initVarialUI(document)
  • Any stackHTML, React, Vue, Svelte, and Astro adapters.
  • Your brandOne theme file sets color, radius, borders, and shadow.
  • Keyboard firstFocus and keyboard handled by the runtime, not by you.
  • Light and darkEvery component, both modes, from the same tokens.

Also in the runtime. Ours, top to bottom.

  1. ChartsThirty-three chart families that look like your product.
  2. IconsFree, animated SVG icons with tones and effects.
  3. SpatialWeb pages made of paper, cloth, metal, and glass.
  4. MotoMotion that ships as code, not as a video.

Good questions. Short answers.

Which frameworks does it support?

Plain HTML with the headless runtime, plus adapters for React, Vue, Svelte, and Astro.

Can I match my brand?

Yes. One theme sets color, radius, borders, and shadow, and exports as CSS variables or JSON.

Are the components accessible?

Keyboard and focus are handled by the runtime, so menus, dialogs, and pickers behave the way people expect.

Does it cost extra?

No. Varial UI, Charts included, comes with every plan.

Start with better parts.

Varial UI comes with every plan.

See pricing