@aur-ui/ui

Aur design language for React — borderless surfaces, a soft ink palette, and squircle radii. Components, composite patterns, and hooks built on Radix UI / Base UI and Tailwind CSS v4.

Install

pnpm add @aur-ui/ui

Peer dependencies: react >= 19, react-dom >= 19, tailwindcss >= 4.

Wire up Tailwind

In your global stylesheet, import the Aur tokens and let Tailwind scan the package for the utilities its components use:

@import "@aur-ui/ui/styles/globals.css";
@source "../node_modules/@aur-ui/ui/dist";

The tokens file already contains @import "tailwindcss", so it can serve as your global stylesheet directly.

Use

import { Button } from "@aur-ui/ui/components/button";
import { SearchField } from "@aur-ui/ui/components/search-field";

export function Toolbar() {
  return (
    <div className="flex items-center gap-2">
      <SearchField placeholder="Search projects…" />
      <Button>New project</Button>
    </div>
  );
}

Every component is also importable individually (@aur-ui/ui/components/*, @aur-ui/ui/patterns/*, @aur-ui/ui/hooks/*, @aur-ui/ui/lib/*), so bundlers tree-shake what you don't use.

License

MIT