Skip to content
← Tools / Skills
Skill · .md packageManav Arya Singh/10 trustVerified
designlang logo

designlang

Reverse-engineer any website into a complete design system as an agent skill

Visit official site →

About

The agent-skill surface of designlang, a widely adopted tool that points a headless browser at any URL and extracts the full design system: DTCG tokens, Tailwind config, Figma variables, motion tokens, and WCAG contrast scores. Ships as a Claude Code plugin with eleven slash commands plus an installable skill for 40+ agents, so an agent can extract, grade, and clone a site's design without leaving the terminal.

What it can do

  • Extract DTCG tokens, Tailwind config, and Figma variables from any public URL
  • Score clone fidelity with visual and motion diffing
  • Generate a one-command Next.js clone and agent-ready prompt packs

Setup

npx skills add Manavarya09/design-extract

Or in Claude Code: /plugin marketplace add Manavarya09/design-extract, then /plugin install designlang@designlang

One-time browser install: designlang install-browser

Prerequisites

Node 20+; a Chromium or Chrome browser for extraction (bundled Playwright installer provided)

Use cases

extracting design tokens from a live sitegrading clone fidelity against an originalgenerating a design.md from a websitedetecting design drift in ci

Works with

Claude CodeCursorWindsurf

Trust score — 9/10

/10 trustVerified

Scored 9/10 (verified tier, metrics-v1). Evidence: The designlang agent skill from Manavarya09/design-extract (4,227 stars, MIT); skill install and plugin install verified from the README on 2026-10-13.; Reverse-engineers live sites into DTCG tokens, Tailwind config, Figma variables, and motion tokens with measured fidelity scoring — unusually deep functionality.; Node 20+ and a browser are required; extraction quality depends on the target site being publicly reachable and renderable.. License: MIT per GitHub license field..

★ 4,227 GitHub stars

How the trust score is built

Full methodology →
Adoption · stars/downloads, log-scaled vs peers
9.0/10
Maintenance · recency, releases, issue load
9.0/10
Openness · license + docs
9.0/10
Manual review · sanity read + red-flag check
9.0/10
  • · The designlang agent skill from Manavarya09/design-extract (4,227 stars, MIT); skill install and plugin install verified from the README on 2026-10-13.
  • · Reverse-engineers live sites into DTCG tokens, Tailwind config, Figma variables, and motion tokens with measured fidelity scoring — unusually deep functionality.
  • · Node 20+ and a browser are required; extraction quality depends on the target site being publicly reachable and renderable.

Sources

Every fact above was checked against these sources. Where a claim comes from the provider and couldn't be independently verified, the text says so.