Introduction & Vision

Why we built Ethereal UI: a 100% free, open-source, dark-mode native enterprise dashboard block kit inspired by BoardUI and shadcn/ui.

Executive Summary

Ethereal UI (@etherealui/react) is an open-source, dark-mode first enterprise component library and dashboard block system built with React 19, Tailwind CSS v4, Radix UI Primitives, and Astro v5.

Unlike commercial UI kits that lock data-dense enterprise tables, collapsible app shells, RBAC governance views, and multi-metric KPI sparklines behind a $299+ PRO paywall, every single primitive, block, and full-page template in Ethereal UI is 100% free and MIT-licensed forever.

Core Architectural Pillars

  1. 100% Free Enterprise Blocks: Every dashboard shell, server-side ready data table, slide-over telemetry drawer, and RBAC settings matrix is completely open-source.
  2. BoardUI + shadcn/ui Experience: Interactive live playground canvases with responsive viewport switchers (Desktop, Tablet, Mobile), one-click source code copy, and a static JSON Registry API (/registry/[slug].json).
  3. Astro v5 Islands Engine: Ultra-fast documentation with zero unnecessary client overhead—hydrating interactive React 19 primitives via Astro Islands (client:load).
  4. Tailwind CSS v4 Native: Zero legacy tailwind.config.js bloat. Powered purely by native @import "tailwindcss"; and @theme CSS variable tokens.
  5. Headless Accessibility (a11y): Dialogs, Drawers, Comboboxes, Dropdowns, Switches, and Tooltips are built on Radix UI Primitives for strict WAI-ARIA compliance and full keyboard navigation.