xBot · Design system

Components

Single source of truth for the new xBot UI. Each primitive lives on its own page so the rendered code is the spec. Built on Tailwind + design tokens; light theme default with a one-click dark switch.

Buttons
Primary, secondary, ghost, danger · sm / md / lg · with icons
Forms
Inputs, textareas, validation states
Cards
Plain, subtle, linkable, with header actions
Tables
Header, rows, empty state
Badges
Status pills with semantic variants
Modals
Dialog, sheet, three sizes, focus management
Toasts
Live regions, success/danger/info variants
Empty states
Icon, title, body, primary action
Icons
Inline lucide-style SVG set
Typography
Type scale, weights, mono
Colors
Tokens · light + dark
i18n + RTL
English · Hebrew · logical CSS properties
Workspace shell
Topbar + 2-tier sidebar + mobile bottom tabs
Credits widget
Balance + 30-day usage breakdown by action
Mobile primitives
Sheet (slide-up), swipe card, slim app-bar
Settings preset
Toggle grid · quickpicks · dependency gating
English עברית v1 · 2026-06-03