miksin-ui

A token-based CSS design system. Pure CSS classes that work with any JS framework. Tailwind-compatible.

Installation

npm install miksin-ui

Usage — CSS import

Works with any framework. Import the CSS and use the classes directly.

import 'miksin-ui/dist/miksin-ui.css'

<button class="btn">Click me</button>

Usage — Tailwind v4

Import the CSS after Tailwind. Token utilities (bg-primary, text-fg, rounded-base, etc.) are generated automatically.

/* app.css */
@import "tailwindcss";
@import "miksin-ui/dist/miksin-ui.css";

Theming

Override CSS variables in your own stylesheet to set your brand colors.

:root {
  --color-primary-500: oklch(58% 0.22 145); /* green */
  --color-secondary-500: oklch(65% 0.18 260); /* blue */
  --radius-base: 0.5rem;                    /* less round */
}