Introduction
SolarUI is an open-source UI component library designed to help you build beautiful, accessible, and consistent interfaces faster.
Built on top of shadcn/ui , Tailwind CSS , and Radix UI , SolarUI provides a set of copy-paste-ready components that you own and can customize to fit your design system.
Tech Stack
| Technology | Role |
|---|---|
| Next.js | Framework |
| Tailwind CSS | Styling |
| shadcn/ui | Component primitives |
| Radix UI | Accessibility primitives |
| TypeScript | Type safety |
Philosophy
SolarUI is built on a few intentional principles. Not arbitrary conventions — each one addresses a real visual or interaction problem.
Open code, no lock-in
SolarUI is built on shadcn/ui, and that choice is as philosophical as it is technical. shadcn/ui is not a component library in the traditional sense: you get the source code directly in your project. You own it, you can read it, modify it, adapt it — no workarounds, no wrappers, no lock-in.
“This is not a component library. It is how you build your component library.”
Controls share a single height
Buttons and inputs must always have the same height. When a button sits next to an input, they form a single visual unit — if their heights differ, that unit breaks.
This is enforced at the token level via h-control, which maps to --height-control. Changing one automatically changes both.
Group, categorize, order
At Solar, we pay careful attention to how components and icons are sorted and grouped. This is not an aesthetic concern — it is a structural decision.
Elements that are close together are perceived as related: grouping components that share a role creates an implicit visual grammar. A well-defined category says not only what it contains, but also what it does not accept — which prevents drift and keeps the system manageable as it grows. And when components are well organized, gaps become visible: a sparsely populated category immediately signals what is missing.