Base UI

v1.3.0 is out 🚀 ✔︎ Drawer is stable ✔︎ New SwipeArea for Drawer ✔︎ New Label for Select, Combobox + Slider ✔︎ New InputGroup for Combobox + Autocomplete. ✔︎ New closeOnClick prop for Tooltip ✔︎ Content transitions support for Menu via Viewport

Built with @base_ui.

Just dropped the @coss_com Drawer component 📦✨ ✅ 4 directions + 3 built-in variants ✅ Snap points & Nested support ✅ Swipe-to-open area ✅ Responsive examples (Dialog & Menu → Drawer)

v1.3.0 is out 🚀 ✔︎ Drawer is stable ✔︎ New SwipeArea for Drawer ✔︎ New Label for Select, Combobox + Slider ✔︎ New InputGroup for Combobox + Autocomplete. ✔︎ New closeOnClick prop for Tooltip ✔︎ Content transitions support for Menu via Viewport

New SwipeArea component coming soon to Base UI Drawer. Swipe close to the edge of the viewport to open the Drawer. Similar to YouTube's Drawer.

Just gave @base_ui's “detached triggers” API for Popovers a spin — feels sooo good before vs after

Instagram Reels UI built using @base_ui drawer. Indent effect makes the interaction feel smooth and natural.

Inspired by this tweet and group94 memories, I decided to do rebuild some components using their iconic style / motion / sfx. Here's a Select using @base_ui and @motiondotdev. Should I build more of this? ps: sound on for the full experience.

Base UI + Tailwind (ShadCn) has made component libraries feel like a solved problem

Base UI crossed 1.1M+ weekly downloads. We grew ~19% weekly for the past 7 weeks. Not that for one year in 📈

The @base_ui Drawer is now available in basecn ✨ ✅ Direction support ✅ Nested drawers ✅ Quick installation using @shadcn CLI ⏳ Snap points, indent effects & more coming soon…

Introducing: Drawer v1.2.0 ✔︎ New Drawer component ✔︎ New useFilteredItems hook ✔︎ Support lazy element in `render` ✔︎ Tons of Combobox + Autocomplete improvements ✔︎ Support `keepMounted` on NavigationMenu ✔︎ Support `finalFocus` on Select base-ui.com/react/overview…

Experimenting with toast deduplication on @base_ui: instead of stacking them, I just make the same toast pulse slightly. Inspired by how @linear handles it.

@base_ui makes it so simple

A code block command component with copy support, built on @base_ui Tabs. Install via @shadcn CLI $ npx shadcn add [@]ncdai/code-block-command Full details in the comments.

At Cloudflare we have been building a new component library on top of @base_ui – we call it Kumo. It's an opinionated style layer on top of accessible components with some additional tools, such as: - Pre-styled components - Figma plugin (code -> design) - Streaming UI support - AI-ready component registry - CLI Why are we sharing this? We love to give back to the internet. We don't expect this to be a library that everyone adopts and uses in all of their projects. Maybe you like it and want to use it & that's great. But we can share our tooling and our learnings with the community to make developing beautiful UI's easier. If you have been looking at the Cloudflare dashboard UI for the past few months you have probably noticed this new component library in action. While we have a long way to go to make it perfect.... we're happy with how it's coming along! Huge shoutout to all the contributors who have helped build this internally. Wouldn't be where it is without all the help :) @JonnieLappen @mattrothenberg @superhighfives @nandafyi @hkfoster @invisal89 @RozenMD @bradgarropy + Rob & many more

Introducing RTL support for shadcn/ui. Your components now work in right-to-left languages. We've been thinking about this one for a while. Traditionally, for a library to support RTL, they had to bake in RTL classes like ms-4 and start-2 or use rtl variants. You end up dealing with RTL even if you're not building for it. We used the registry and CLI to do it differently. Take a look.

Glean, $200M+ ARR, recently revamped their design system, migrating it to @base_ui. Great outcome: VPAT to pass Accessibility Conformance Report (ACR), covering WCAG 2.0, 2.1, and 2.2 at Levels A and AA. @tonygentilcore and team, well done. glean.com/blog/designing…

Welcome, Mintlify!

@olivtassinari @rauchg 👀

@rauchg 4. The modals have focus trapping issues

New vercel dashboard who dis 👀 ① Go to vercel.com/try/new-dashbo… ② Enable it ② Share your feedback I'll send ▲ swag to the best pieces of feedback (validated bug reports, improvements, etc)