Unlumen UIUnlumen UI

Unlumen UI started after hours of going through shadcn registries. Many were quick to impress and just as quick to fade, and some felt vibe-coded. It began as a fork of Animate UI, and the credits page says so. What I wanted to add was care: fewer tricks, better details, code you’d want to keep.

The first component was Floating Tooltip, and I made it for myself. Somewhere after that, I understood it could be useful to people other than me.

135

components

+500k

CLI pulls

79

stars on GitHub

A gallery you can scanA gallery you can scan

A component library is browsed before it’s read. So the gallery is built for looking: sections with a count, one line saying what’s in them, and a thumbnail caught in the middle of the interaction, with the cursor still in it. A still image of a menu tells you nothing. A still image of a menu being used does.

Free and Pro sit in the same grid, with a filter instead of two separate pages. You judge the component first and find out the price later.

The component page is the demoThe component page is the demo

The usual component page is an article with a small box of preview in it. I turned that around: the demo takes the whole page, and the documentation waits behind a button in a floating toolbar. The loop I wanted was discover, inspect, tweak, understand, install, without leaving the screen.

Settings tune the real props while the component runs, so you learn what a value does by moving it. It’s also the fastest way for me to find a bad default. Here’s the same idea, running in this page. The presets show what the wrong numbers feel like.

No package to installNo package to install

Components go through the shadcn registry, so the code lands in your project. There’s no dependency to update and nothing to fight when your design needs something I didn’t plan for.

npx shadcn@latest add @unlumen-ui/smart-animate-text

That changes what the code has to be. Somebody is going to open this file and read it, so it has to read well, not only run well. It’s also why the source opens in a drawer over the live demo: reading the code and watching it run belong on the same screen.

Where the gate goesWhere the gate goes

Pro components aren’t hidden. You can open the page, play with the demo and tune it for as long as you like. The gate only appears when you reach for the source, and it has a real way out: “Maybe later.”

The repositories draw the same line: the docs and the public registry are MIT, and Pro lives apart. That’s a story of its own, in “Rebranding Unlumen UI.”

Some of it, runningSome of it, running

These are the library’s components, on this page. Each one has its own note about what’s hard in it.

What came backWhat came back

Awwwards featured it. The Vercel OSS program took it in. And the kind words I read twice were the specific ones: “text animation usually gets cheesy fast but this feels clean.”