Get a DESIGN.md
from any website
Paste a URL and read the design system underneath it — palette, typefaces, logo — in seconds, free.
Supabase
Build production-grade applications with a Postgres database, Authentication, instant APIs, Realtime,…
Palette
- Background
#000000 - Surface
#0f0f0f - Foreground
#ffffff - Muted
#8c8c8c - Border
#1f1f1f - Accent
#3ecf8e - Accent secondary
#bda4ff
Typefaces
- Inter
- Source Code Pro
- Manrope
Extract your own site to see yours here.
Get the DESIGN.mdOne file your whole stack can read.
A DESIGN.md is plain Markdown. Copy it to your clipboard in one click, drop it in your repo, and any AI coding agent can follow it — Claude Code, Codex, Cursor, or the builder here.
- PaletteBrand, surface and state colours, with the roles each one plays.
- TypographyFamilies, weights and the scale that decides a heading from a caption.
- Spacing & radiiThe rhythm a page keeps, so generated layouts don't drift.
- ComponentsHow a button, a card and a form are built in your system.
- Voice & imageryThe tone of the words and the kind of pictures that belong.
- Do's and don'tsThe rules taken from evidence on your own site, not guessed.
# Acme
> Category: Brands · Surface: web
## Palette
| Token | Value | Role |
| --- | --- | --- |
| `brand` | `#0d9488` | Primary actions |
| `ink` | `#141518` | Body text |
## Typography
Display — Space Grotesk, 500, -0.03em
Body — Inter, 400, 1.6 line heightFrom a URL to pages that look like you.
We read the whole brand
Signed in, the extraction goes deeper than this preview: voice, imagery, spacing and component rules, not just the palette.
It becomes a DESIGN.md
A single readable file — the open format design tools and AI agents can both use. Copy it to your clipboard, edit it in place, or download the whole folder.
Every page inherits it
Ask for a landing page, a pricing page, a deck. They come out in your brand, because the builder generates from that file.
Before you paste a URL.
What is a DESIGN.md?
A single readable Markdown file that describes a design system — palette, typography, spacing, components, voice — in a form both people and AI coding agents can follow. It is plain text, so it lives in your repo, diffs in a pull request, and is not locked to any one tool.
What does the free extraction show me?
The surface of the brand: the colour palette, the typefaces the site loads, and its logo — read straight off the page's markup and stylesheets. No account, nothing to install.
How is the full DESIGN.md different?
Signed in, the extraction goes deeper than the preview: spacing scale, radii, component rules, imagery direction and tone of voice, written into a DESIGN.md alongside a tokens.css and a package manifest. Your first one is free.
Can I use the file outside Nuvra?
Yes. Copy the DESIGN.md straight to your clipboard — the whole file, or just the section you need — paste it into Claude Code, Codex or Cursor, and you are done. Download the design system as a folder when you want the tokens and the manifest with it. It is your file; nothing about it requires Nuvra to stay useful.
Do you keep the site I paste?
We do not copy the page or create an account for you. We record the domain that was extracted so we can see which kinds of sites the tool reads well, and we count extractions per visitor to keep the free tier free.