s
GitHub

Introduction

solidcn

A port of shadcn/ui for SolidJS — accessible, composable, and yours to own.


What is solidcn?

solidcn is not a component library in the traditional sense. It's a collection of reusable components that you copy and paste into your project. You own the source code. No version lock-in, no library to update, no style overrides.

Pick the components you need, copy them into src/components/ui/, and customize them to your heart's content.

Tech stack

@kobalte/core

Headless WAI-ARIA primitives for SolidJS

corvu

Advanced UI primitives (Drawer, Resizable)

tailwind-variants

Type-safe variant management

Tailwind CSS v4

Utility-first CSS with CSS variables

FAQ

Is this a dependency I install?

No. solidcn is a CLI that copies component source files into your project. @solidcn/core is only needed if you want the distributed package instead of the copy-paste workflow.

Can I customize components?

Absolutely. Since you own the source, you can change anything — styles, behavior, types. It's just TypeScript + Tailwind.

Is it production ready?

Components are built on well-tested headless libraries (Kobalte, corvu). The styling layer is Tailwind which you control.