v1.1 available on npm

Benix DS a React design system that adapts to your brand.

Built on Tailwind CSS 4 and Radix UI. Free, MIT-licensed and maintained by Kactos Tecnologia from the Benix CRM ecosystem.

Get started in one command

npx @kactostecnologia/benix-ds init

Why benix-ds?

The pieces we built for Benix CRM, now available for any React app.

Fully themeable

Every color, radius and surface is a CSS variable. Override in 5 lines to adapt to your brand.

~28 components

Primitives, forms, overlays, feedbacks and data display — all accessible and built on Radix UI.

Framework-agnostic

Works with Vite and Next.js 16 today. Tree-shakeable subpaths import only what you need.

106 tests

Unit suite covering primitives, forms, overlays, feedbacks and the CLI. CI on every PR.

npx init CLI

Detects your framework, installs peers, edits CSS, configures transpilePackages. Seconds.

🌗

Dark mode

Wired by default. Add .dark to <html> or use the exported ThemeProvider.

No proprietary CSS-in-JS.

Just React + Tailwind CSS 4. Import a component, use it, customize via className or CSS variables. No lock-in, no runtime style engine.

page.tsx

import { Button, Card } from '@kactostecnologia/benix-ds';

export default function Home() {
  return (
    <Card title="Welcome">
      <Button>Get started</Button>
    </Card>
  );
}