asciicn is a monochrome component library distributed as a shadcn/ui registry. Drop ASCII-styled UI primitives into any React project with a single CLI command — no package lock-in, just copy-paste components you own.

Features

• shadcn registry — install components with npx shadcn@latest add @asciicn/{name}
• Monochrome aesthetic — terminal-inspired, ASCII-friendly styling
• Live docs — previews and install commands powered by Fumadocs
• Auto-built registry — JSON regenerated from source on every dev / build

Quick start

Add the asciicn registry to your consumer components.json:

{
  "registries": {
    "@asciicn": "https://your-domain.com/r/{name}.json"
  }
}

Install a component:

npx shadcn@latest add @asciicn/ascii-badge

Use it in your app:

import { AsciiBadge } from "@/components/asciicn/ascii-badge"

export function Example() {
  return (
    <>
      <AsciiBadge>default</AsciiBadge>
      <AsciiBadge variant="outline">outline</AsciiBadge>
    </>
  )
}

Local development

pnpm install
pnpm dev

Open http://localhost:3000/docs to browse components and previews.

pnpm dev and pnpm build regenerate registry JSON from components/asciicn automatically. To rebuild the registry manually:

pnpm registry

Project structure

components/asciicn/   # Registry component source
content/docs/         # Fumadocs documentation
public/r/             # Generated registry JSON
registry.json         # Registry manifest

Adding a component

1. Create a file under components/asciicn/
2. Register it in registry.json
3. Run pnpm registry or restart pnpm dev
4. Document it under content/docs/components/

Links

• Documentation
• Components
• shadcn/ui