Start with a solid foundation.

The alpha is available in this workspace. Public npm packages have not been published.

1. Run the workspace

Use Node.js 22.12+ and pnpm 11.25.0. From the repository root:

corepack enable
pnpm install --frozen-lockfile
pnpm build
pnpm dev:docs

2. Use package mode

In a workspace app, declare @devvy-ui/react, @devvy-ui/styles and @devvy-ui/tokens as workspace dependencies. Import the styles once:

import "@devvy-ui/tokens/theme.css";
import "@devvy-ui/styles";
import { Button } from "@devvy-ui/react/button";

export function Save() {
  return <Button>Save changes</Button>;
}

3. Or own the source

After building, run the local CLI from your React project. Replace the example path with this checkout’s absolute path:

node /path/to/devvy-ui/packages/cli/src/cli.mjs init
node /path/to/devvy-ui/packages/cli/src/cli.mjs add button tabs
node /path/to/devvy-ui/packages/cli/src/cli.mjs doctor

Import src/devvy.css in your application entry. The installer copies the same source used by package mode and refuses to overwrite edited files.

Using Next.js

Import styles in the root layout. Use interactive components from client components. Package entries preserve a client boundary; pure CSS and static markup remain available without hydration in the vanilla example. The docs app is itself a Next.js integration example.

Make it your own

Every component accepts className, style and native attributes. Override theme tokens for your colors, typography and spacing, or use the source installer to change the implementation itself. Component pages include an editable TSX source file you can copy or download.