@raandino/atelier

Install the atelier skill into any AI coding harness — so Claude Code, Cursor, or Codex generates interfaces the Truora way (on-brand color, Host Grotesk, the Glass Effect, no AI slop).

This is the installer CLI, not a library. Running npm i @raandino/atelier only downloads the package — to install the skill, run the command below.

Install the skill

Run this inside your project (a git repo — the skill installs at the repo root):

npx @raandino/atelier skills install

It auto-detects your harness and installs one copy into the right folder — if your project has exactly one harness dir, that's the one; with several, it asks (or -y takes the first detected):

| Harness | Installs to | | --- | --- | | Claude Code | .claude/skills/atelier/ | | Cursor | .cursor/skills/atelier/ | | Codex | .agents/skills/atelier/ |

Installs from pre-rename versions? The same install also removes a stale skills/truora-design/ dir (logged, idempotent).

Target specific harnesses with --providers:

npx @raandino/atelier skills install --providers=claude,cursor,codex -y

Use it

Open your AI tool in that project — the atelier skill is now available. In Claude Code it's user-invocable, with four actions (wireframe · design · prototype · review):

/atelier design a login screen
/atelier review src/

For throwaway mocks it emits on-brand static HTML; for production code it points you at the component library:

npm install @raandino/atelier-react @raandino/atelier-tokens

import '@raandino/atelier-tokens/tokens.css';
import { Button, GlassCard } from '@raandino/atelier-react';

Already on shadcn/ui? Drop in @raandino/atelier-tokens/shadcn-theme.css to reskin it the Truora way.

Keep it current

npx @raandino/atelier skills check      # is a newer version available?
npx @raandino/atelier skills update     # update installed harnesses

Claude Code plugin users update from the /plugin menu instead.

Commands

| Command | Does | | --- | --- | | skills install | Copy the skill into one detected harness folder (--providers for several). | | skills check | Report up-to-date / updates-available / not-installed (no writes). | | skills update | Replace already-installed harnesses with the newer skill (stale files removed). | | skills link | Symlink the bundled skill into targets (dev convenience). | | help | Show usage. |

The skills namespace is optional — atelier install works too.

The Atelier family

| Package | What | | --- | --- | | @raandino/atelier | This CLI — installs the agent skill. | | @raandino/atelier-react | React components (typed, tree-shakeable). | | @raandino/atelier-tokens | Design tokens — CSS vars, Tailwind preset, shadcn theme. |

— The Truora design system. Source: Truora-Agentic/atelier.