October 2026 - Styles and RTL

Dice UI components now follow the same style system as shadcn/ui.

Styles

Every component ships in all shadcn/ui styles: Vega, Nova, Maia, Lyra, Mira, Luma, Sera, and Rhea. The CLI installs the version that matches the style in your components.json, so a Base UI project on Lyra gets Lyra's radius, spacing, and type scale:

pnpm dlx shadcn@latest add @diceui/action-bar

Each style follows shadcn/ui's own components, so an input, popup, or menu item in Dice UI matches its shadcn counterpart in that style. Nova now matches shadcn/ui's Nova too, which is denser than before (for example h-8 rounded-lg inputs instead of h-9 rounded-md).

Use the style switcher on any component preview to see how it looks in each style.

Your project config

Installed components now pick up the rest of your shadcn/ui setup:

• Icons come from your iconLibrary (Lucide, Tabler, Hugeicons, Phosphor, or Remix Icon).
• Titles in Banner, Stepper, Timeline, and Tour use font-heading when your CSS defines --font-heading.
• Popups in Combobox, Faceted, Mention, and Time Picker follow your menuColor, including the translucent options.
• Surfaces in Kanban and Media Player use theme tokens like bg-muted and bg-popover instead of fixed grays, so they follow your base color.

RTL

Set rtl: true in components.json and the CLI converts directional classes to logical ones (ml-* to ms-*, left-* to start-*) and flips directional icons as it installs.

Data Table and Data Grid install from tablecn, which doesn't support styles yet, so they install in the same style for every project for now.

Components you've already installed keep working. Reinstall them to pick up your style and config.