Interactive catalog of all UI components used in RetroHexChat. Each component is a reusable, self-contained building block with generic callbacks — no hardcoded event names.
SaladUI base widgets — buttons, inputs, badges, toggles, selects, and other atomic form controls.
Structural containers — dialogs, tabs, tables, menus, tree views, windows, and scroll areas.
Chat-specific components — messages, nicklist, emoji picker, formatting toolbar, context menus, and more.
Win98 app shell composites — toolbar app, status bar app, app header, config form, and empty states.
Complex dialog composites — channel settings, perform, address book, sound settings, and the admin console family.
Peer-to-peer session components — connection diagram and file transfer.
Arcade components — game cards and the solo lobby.
Icons catalog, SVG diagrams, and design tokens reference.
Semantic color tokens mapped to retro palette.
Font sizes using Source Code Pro monospace.
text-xs — 12px — Caption text
text-sm — 14px — Small text
text-base — 16px — Body text
text-lg — 18px — Large text
text-xl — 22px — Heading
text-2xl — 26px — Title
Win98-style inset box shadows for retro depth.
Retro spacing tokens (retro-1 through retro-32).
Contextual colors for feedback, online status, and IRC roles.
Feedback
Online Status
IRC Role Badges
7-layer stacking context for overlays, modals, and tooltips.
4 standardized SVG icon sizes used across the design system.
Retro-style focus indicators and the two border-radius tokens.
Focus Ring
Border Radius