BMates UI

A Design System for Personal Branding

Production-ready React components, dependable interaction patterns, and tokens that help teams build with clarity.

Buttons, inputs, and selection

Compose forms and actions from accessible, consistent controls.

Navigation and feedback

Guide people through tabs, dialogs, toasts, alerts, and status changes.

Tokens and themes

Use one visual language across products, including light and dark modes.

READY TO SHIP

Start with the primitives every interface needs.

Install the package, load its styles, then combine components without rebuilding common interaction patterns for every feature.

import { Button, Input, Badge } from 'bmates-ui';
import 'bmates-ui/style.css';

export function App() {
  return (
    <section>
      <Badge variant="success">Ready</Badge>
      <Input label="Release title" />
      <Button variant="primary">Publish release</Button>
    </section>
  );
}