cladd

Foundation: Sizing One scale — 2xs → 2xl — that every interactive control respects. Drop a Chip inside a Button at the same size: the Chip auto-shrinks 8px so the row stays clean. No per-component math. cladd.io/react/foundati…

Also is powered by latest @cladd_ui now 💪

Component: Shortcut Keyboard shortcut hints rendered as proper kbd glyphs - ⌘K, ⌃⇧P, ⌥↵. Sized to nest cleanly inside Button, Toolbar, or stand alone in a List row. → cladd.io/react/componen…

Did a blog post about rebuilding the Swiper Playground with cladd swiperjs.com/blog/rebuildin…

Just asked Claude Code to migrate Swiper Playground to @cladd_ui using its MCP server. And it is fully nailed it. Check it out at swiperjs.com/playground . And asked him for feedback about cladd's MCP :)

I am currently rebuilding PaneFlow on the latest @cladd_ui with @nucleoicons - and it's coming together fast and beautifully 😍

Example of how @cladd_ui's "dense, not crowded" actually looks like in production: Swiper Studio's inspector - 30+ controls in a single column, no second-guessing what's where studio.swiperjs.com

useDialog() Open a confirm, alert, or custom dialog from anywhere - a hook, an event handler, an async flow. Controlled, not just compound. → cladd.io/react/hooks/us…

Foundation: Surfaces Five depth levels that nest contextually. Drop a Surface inside a Surface - the next one auto-bumps to the right level. No manual color picking. No "is this card lighter or darker than its parent?" → cladd.io/react/foundati…

Fun fact about @cladd_ui demos - they're all built with @claudeai Code + cladd's free MCP, with just a few tweaks after. Cladd's MCP isn't a bare schema btw - it has instructions that teach AI agents how to actually use and build with cladd. cladd.io

Component: Toolbar The app-shell part you actually use - buttons, separators, segmented controls, dropdowns - all on one row, same height, no eyeballing. → cladd.io/react/componen…

Super excited to finally introduce @cladd_ui today - two years in the making. It started inside t0ggles because nothing else gave me dense, nestable surfaces I could trust. Then I kept reaching for it - PaneFlow, Start Page HQ, Swiper Studio all built on it.

npm i cladd-ui/react Docs, demos, full component catalog → cladd.io MIT. Free forever.

There's an MCP server too. Point Claude Code, Cursor, or any MCP-capable agent at cladd.io/mcp/ and it gets the full docs - every component, foundation, hook, with screenshots inline. Less guessing, fewer hallucinations.

Introducing cladd - an opinionated React UI kit for building actual apps. Editors. Dashboards. Design tools. Internal tools. The kind of UI where forty controls have to coexist on one screen and still stay legible. cladd.io