A lightweight, token-driven React + Tailwind component system.

• @unhq/tokens — CSS variables for light/dark; the single source of truth.
• @unhq/tailwind-preset — Tailwind config that maps tokens → utilities.
• @unhq/ui — Headless-ish, token-first components.
• @unhq/blocks — Higher-level compositions (optional, WIP).
• apps/docs — Ladle stories for visual tests and theming controls.

Install core packages:

pnpm add @unhq/ui @unhq/tailwind-preset @unhq/tokens

tailwind.config.ts

import type { Config } from "tailwindcss";
import preset from "@unhq/tailwind-preset";

export default {
  presets: [preset],
} satisfies Config;

globals.css

@import "@unhq/tokens/styles.css";
@tailwind base;
@tailwind components;
@tailwind utilities;

Then use components:

import { Button } from "@unhq/ui";

export function Example() {
  return <Button>Click me</Button>;
}

Tokens → Tailwind preset → components.
See docs/THEMING_CONTRACT.md.

• Node.js v18 or v20 (LTS recommended)
• pnpm v10+
• A GitHub account + SSH setup

• Run docs locally:

  pnpm -C apps/docs dev

• Build all packages:

  pnpm -w build

• Typecheck:

  pnpm -w typecheck

• Work should be done in feature branches.
• Use descriptive branch names:
  • feat/button-secondary
  • fix/input-focus-ring
  • chore/size-limit

Open a PR into main when ready.

Every PR and push to main runs CI:

• Typecheck
• Build
• Docs build (Ladle)
• Size-limit guards
• Publish dry-run

CI must be green before merging.

We use Changesets for versioning and releases.

For user-facing changes:

pnpm changeset      # choose bump + write summary
pnpm -w version     # update versions & changelogs
git push --follow-tags
pnpm -w publish     # publish to npm

See CONTRIBUTING.md for full guidelines.

MIT © UnHQ