✨ Enterprise Component System

Build your component library.
Copy. Paste. Customize.

Beautifully crafted, production-ready React components built with TypeScript and Tailwind CSS. Directly installed into your codebase via CLI.

Get StartedBrowse Components
$ npx ruma-ui init

Live Component Showcase

Interactive preview of components ready for your application

Button & Badge

Visual Variants

Built-in states, sizes, and color palettes.

NewBetav0.1.0
npx ruma-ui add buttonView Docs →
Card & Switch

Structured Containers

Header, body, footer, and form controls.

Notifications

Configure how you receive alerts.

Push Notifications
npx ruma-ui add cardView Docs →
Tabs

Tabbed Navigation

Uncontrolled and controlled state management.

npx ruma-ui add tabsView Docs →

CLI Component Delivery

Add individual components directly into your source folder using `npx ruma-ui add` with zero bloat.

🎨

Tailwind CSS & CSS Variables

Fully styled with Tailwind CSS custom tokens. Easily customize colors, fonts, and dark mode themes.

🛡️

100% TypeScript

Type-safe component props, autocomplete, and strict TypeScript definitions out of the box.