Chrome extension. MV3. Zero telemetry.

Export any shadcn preset as
a DESIGN.md

One click on ui.shadcn.com/create. Get a portable design spec for AI coding agents: rules, decoded config, and resolved globals.css. Byte-equivalent to shadcn apply.

Open source. MIT. No account required.

How it works

Three steps. No accounts.

Decode happens client-side using the same algorithm shipped in the shadcn CLI. Output is byte-equivalent to shadcn apply.

Install the extension

Load apps/extension/dist as an unpacked extension. Only one match pattern: ui.shadcn.com/create. Zero permissions beyond it.

chrome://extensionsMV3
shadcn DESIGN.mdv0.1.0
Permissions: none
match:ui.shadcn.com/create*
Open any preset URL

On ui.shadcn.com/create the DESIGN.md button slots into the sidebar between Shuffle and Create Project. Same chrome as the native UI.

|
sidebar
Pick a format. Copy or download

DESIGN.md (rules for AI agents), Raw decoded JSON (full preset config), or Export CSS (resolved :root + .dark + @theme inline).

# Preset b4toiItxg0
 
## Visual identity
Apply: pnpm dlx shadcn
apply b4toiItxg0
DESIGN-b4toiItxg0.md

Use cases

Whatever consumes your design tokens

DESIGN.md, raw JSON, or globals.css. One preset URL, three formats, every coding agent and framework.

Claude Code / Cursor

Drop the DESIGN.md into your repo. Agent picks up rules + tokens + commands.

v0 / Lovable / Stitch

Paste DESIGN.md as a system prompt. Agent generates components in your brand.

Quick prototyping

Grab the resolved globals.css. Drop into any Tailwind v4 + shadcn project.

Theme handoff

Send a designer a single URL. They preview live; engineering installs via CLI.

Tooling integrations

Raw decoded JSON for build scripts, design system audits, or registry tooling.

Documentation

Commit DESIGN.md alongside CONTRIBUTING.md. New contributors get the rules.

Why this exists

A portable design spec for AI agents

shadcn presets are great for humans. AI coding agents need rules plus values plus a CSS file. This extension gives you all three.

Byte-equivalent decode

Same base62 bitpack algorithm as the shadcn CLI. Output matches `apply` exactly.

Live theme registry

Fetches the current registry chunk so OKLCH values stay in sync with ui.shadcn.com.

Three export formats

DESIGN.md narrative, raw JSON config, or resolved globals.css. Pick whichever fits.

?preset=b4toiItxg0
DESIGN.md

AI-agent ready

DESIGN.md encodes shadcn Skill rules: semantic tokens, FieldGroup, no manual dark:.

Zero permissions

MV3 manifest with one match pattern. No activeTab, downloads, storage, or host perms.

Open source. MIT

No telemetry, no analytics, no account. Build it yourself or grab the release zip.

PRIVACY BY DEFAULT

Nothing leaves your browser

The preset code decodes locally. The only network call is to ui.shadcn.com for the theme registry chunk. No telemetry, no analytics, no account, no cookies. MV3 manifest with one match pattern.

Audit the source
content_scripts.matches: ui.shadcn.com/create*
permissions: []
host_permissions: []
telemetry: never

FAQs

Frequently Asked Questions

Find all your doubts and questions in one place. Still couldn't find what you're looking for?

Contact Us

Open a preset.
Click DESIGN.md.

Free. Open source. MIT licensed. No account required.

DESIGN.md
Download extension