extract-design-system

Name: extract-design-system
Author: arvindrk

Extract tokens, components, and patterns from an existing codebase

Installs

130K

all time

This week

293

installs

Repo stars

232

GitHub

First seen

Mar 22, 2026

on skills.sh

Install

npx skills add https://github.com/arvindrk/extract-design-system --skill extract-design-system

Works with Claude Code, Cursor, Codex, GitHub Copilot, Windsurf, Gemini CLI and other agents that read SKILL.md.

What it does

Reverse-engineer design tokens from public websites into starter token files for your project. Extract design primitives from a public website and generate starter token files for your project.

Extracts color palettes, typography, spacing, radius, and shadow scales from a target URL using Playwright
Generates normalized JSON output and CSS token files ready for local project integration
Offers extraction-only mode to review raw primitives before generating starter assets, or init-only mode to regenerate tokens from existing extraction data

Source on GitHub ↗On skills.sh ↗

Paid members see the full Skills library — 200+ of the most-installed agent skills, ranked and grouped by category, with install commands, plus CSV exports. Developer membership is $9/mo.

See plans →Log in