Ancori

How to use Ancori

3 steps. Under a minute.

1

Pick a design and copy it

Go to Designs, open any design system, and click Copy design.md.

ancori.com/anchor/stripe
StripeStripe
Live Preview
Style Guide
DESIGN.md
Copy design.md
2

Create design.md in your project

In your code editor, create a new file called design.md in your project root and paste.

my-project — Cursor
Explorer
▸src/
·package.json
·tsconfig.json
·design.mdNEW
design.md
# Design System — Stripe
## Color Palette
- Primary: #533afd
- Navy: #061b31
- Background: #ffffff
## Typography
- Font: sohne-var, system-ui
- Hero: 56px / weight 300 / -1.4px
- Body: 18px / weight 400
## Components
- Buttons: 4px radius
- Cards: 8px radius, shadow
...
3

Ask your AI to build

Just prompt it like normal. Reference the file with @design.md and your AI handles the rest.

Example prompt

Build me a landing page with a hero, features section, and pricing cards. Follow the design rules in @design.md

Works with
ClaudeClaude Code
CursorCursor
+ any AI tool

That's it. Your AI now builds UI that looks designed, not generated.

Browse designs