GET
/api/extract?url=...&format=json|markdown|mdx
No Anthropic key
Loads the URL in headless Chromium. Return JSON for the full payload, raw Markdown for design.md, or MDX for an export-ready docs artifact.
You can use Free design.md without the browser UI. The deterministic extractor works over HTTP and CLI with no AI key, and the HTTP API can return JSON, raw design.md Markdown, or MDX. Hosted AI enrichment uses purchased AI runs, while local Docker and self-hosted deployments can use your own environment key.
Deterministic extraction does not call an LLM and does not need an Anthropic key.
HTTP extraction can return JSON, raw design.md Markdown, or deterministic MDX.
Hosted AI enrichment uses purchased AI runs and the deployment's server key.
The hosted service does not accept or store user Anthropic keys.
Use your own Anthropic key only in a local checkout or self-hosted deployment via ANTHROPIC_API_KEY.
API surface
The hosted API exposes keyless extraction and AI-run-backed routes. It does not accept user Anthropic keys in headers, bodies, or stored browser settings.
GET
/api/extract?url=...&format=json|markdown|mdx
No Anthropic key
Loads the URL in headless Chromium. Return JSON for the full payload, raw Markdown for design.md, or MDX for an export-ready docs artifact.
POST
/api/enrich-design-md
Hosted AI runs
Streams an AI-enriched design.md as Server-Sent Events. Hosted Free design.md uses its own server key and purchased AI runs; it rejects user-supplied Anthropic keys.
POST
/api/iterate-design-md
Hosted AI runs
Streams a revised design.md from previousMarkdown and userPrompt. The hosted route uses purchased AI runs, not user Anthropic keys.
GET
/api/catalog-designs
Public catalog
Lists curated downloadable design.md artifacts by slug, title, URL, category, description, and best-use text. The CLI uses this for `free-design-md list`.
GET
/api/metrics
Prometheus
Exposes low-cardinality counters and histograms for extraction, AI enrichment, AI iteration, quota outcomes, and artifact exports.
HTTP
Use the hosted API for deterministic design.md extraction. The same endpoint can return structured JSON, raw Markdown, or MDX. Hosted AI routes are available through the web app's signed-in AI-run balance, not by sending your Anthropic key to Free design.md.
format=json
Use this when another tool needs the complete extraction payload: design.md text, token tree, page signals, and screenshot data URL.
format=markdown, format=md, or omit format
Use this when you only want the portable design.md document as text. The response content type is text/markdown.
format=mdx
Use this when a docs site wants an .mdx export with metadata, the designMd string, previewHtml, and a TokenPreview component.
# Hosted deterministic extraction: no Anthropic key required.
curl "https://freedesign.md/api/extract?url=https://stripe.com&format=json" \
-o extract.json
# Raw design.md Markdown. You can also omit format or use format=md.
curl "https://freedesign.md/api/extract?url=https://stripe.com&format=markdown" \
-o design.md
# Export-ready MDX with designMd, previewHtml, and a TokenPreview component.
curl "https://freedesign.md/api/extract?url=https://stripe.com&format=mdx" \
-o design.mdxCLI
The published CLI can list every curated downloadable design.md artifact, filter by category or search text, print JSON for agents, and download a chosen slug into your project.
Grouped terminal output shows the slug, title, source URL, and best-fit usage for each curated artifact.
Use the slug from the list with add to write the enriched design.md file into your repo.
# Browse every curated design.md available for download.
npx free-design-md list
# Filter the catalog.
npx free-design-md list --category "Developer Tools & IDEs"
npx free-design-md list --search stripe
# Use JSON when another agent or script needs the catalog.
npx free-design-md list --json
# Download a curated design.md by slug.
npx free-design-md add stripe --out specs/stripe.design.mdLocal actions
The action layer is the same core surface the UI wraps. In local or private deployments, extraction returns structured JSON on stdout; pipe `.markdown` into a file when you want only design.md text. Set ANTHROPIC_API_KEY in the environment for AI enrichment so the key never passes through the hosted Free design.md service.
Calls Playwright and returns deterministic JSON. No LLM and no key.
Calls Anthropic with the extraction payload and returns the final enriched design.md.
# Deterministic extraction from a local checkout.
pnpm action extract-design-md --url stripe.com > extract.json
# The action returns JSON. Save only the design.md text with jq.
pnpm action extract-design-md --url stripe.com | jq -r '.markdown' > design.md
# For AI enrichment, load ANTHROPIC_API_KEY into your local environment first.
pnpm action enrich-design-md \
--url stripe.com \
--designSystemData '<json from extract>' \
--signals '<json from extract>' \
--screenshotDataUrl '<data URL from extract>' \
--deterministicMarkdown '<markdown from extract>'Self-host
Self-host mode is explicit. It uses ANTHROPIC_API_KEY from the deployment environment and does not spend hosted Free design.md AI runs. Packaged binaries and Homebrew installs are a future distribution path, not something this branch promises.
# Local UI / self-host mode.
# Load ANTHROPIC_API_KEY into this environment first.
FREE_DESIGN_MD_SELF_HOSTED=1 pnpm devDocker
Pull the public image from GitHub Container Registry and run the local UI on port 3000. The latest tag publishes Linux amd64 and arm64 images, so Docker pulls the matching image on macOS, Windows, and Linux developer machines.
Install from ghcr.io/zuchka/free-design-md:latest without cloning the repository.
Point DATABASE_URL at a migrated Postgres database; application startup never changes schema.
# Pull the public image from GitHub Container Registry.
docker pull ghcr.io/zuchka/free-design-md:latest
# Load ANTHROPIC_API_KEY into your shell or secret manager first.
docker run --rm \
-p 3000:3000 \
-e FREE_DESIGN_MD_SELF_HOSTED=1 \
-e ANTHROPIC_API_KEY \
-e DATABASE_URL=postgresql://user:password@postgres-host:5432/database \
ghcr.io/zuchka/free-design-md:latestAfter the container starts, open http://localhost:3000. The command passes the ANTHROPIC_API_KEY variable name to Docker, not the key value; if the variable is missing, self-host mode returns a setup error.
# Optional: build locally from a repository checkout.
docker build -t free-design-md:local .Build locally only when you are developing from a checkout or need to test unreleased changes.
Observability
Free design.md exposes persistent event counters, billing totals, and process-local duration histograms. Metrics use bounded labels: route, status, key source, credit outcome, pack, and artifact format. They never include URLs, prompts, user IDs, org names, saved design IDs, or API keys.
Track free extraction, paid and self-hosted AI requests, fulfilled credit packs, and reserved, committed, refunded, or rejected credits.
Measure extraction and AI stream latency with Prometheus histogram buckets.
# Optional endpoint protection.
PROMETHEUS_METRICS_TOKEN=replace-with-a-long-random-token
# Prometheus scrape config.
scrape_configs:
- job_name: free-design-md
metrics_path: /api/metrics
authorization:
type: Bearer
credentials: replace-with-a-long-random-token
static_configs:
- targets:
- freedesign.mdWhen PROMETHEUS_METRICS_TOKEN is set, /api/metrics requires either an Authorization: Bearer token or an x-prometheus-token header. If you run multiple app processes, scrape each process for latency histograms. Database-backed counters and billing totals are shared; scrape one replica or deduplicate those series before aggregating.
FAQ
Short answers for developers using Free design.md in scripts, agents, CI jobs, and local tooling.
Yes. Use GET /api/extract for deterministic extraction, or run pnpm action extract-design-md from a local checkout.
Yes. Run npx free-design-md list to see every curated artifact, then npx free-design-md add <slug> to download one.
Yes. Set format=json for the full payload, format=markdown or format=md for raw design.md Markdown, or format=mdx for an export-ready MDX artifact. Omitting format returns Markdown.
No. The deterministic extractor does not use AI, so it does not require an Anthropic key.
Run Free design.md locally or in your own self-hosted deployment and set ANTHROPIC_API_KEY in that environment.
No. The hosted API rejects user-supplied Anthropic keys. Hosted AI uses purchased AI runs.
Not yet. A packaged local app is a future distribution path; today's packaged local path is the public Docker image.
Pull ghcr.io/zuchka/free-design-md:latest, run it with FREE_DESIGN_MD_SELF_HOSTED=1 and ANTHROPIC_API_KEY, then open http://localhost:3000.
The public image is published for Linux amd64 and arm64. Docker pulls the matching image on Docker Desktop for macOS and Windows and Docker Engine on Linux.
Related docs
Definition
Learn what a design.md contains, why Markdown is useful for design systems, and how agents use it as implementation context.
Definition
A concise answer-first guide to MDX, including syntax, build requirements, use cases, and common tradeoffs.
Comparison
Compare Markdown and MDX side by side, including portability, syntax, tooling, design docs, and interactive documentation.
Hosted AI uses purchased AI runs. Local and self-hosted runtimes use your own environment, where your key stays under your control.