extract-design-system

Community

Turn public website design into starter tokens.

AuthorDivision6066
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Extract design primitives from a public website and generate starter token files to bootstrap your design system.

Core Features & Use Cases

  • Auto-detect typography, color tokens, spacing scales and generate starter design tokens.
  • Starter files produce CSS variables and JSON tokens for easy integration into design systems.
  • Use Case: When starting a new project and you need a baseline design system aligned with an existing site.

Quick Start

Provide the target public website URL to extract design primitives and choose whether to generate starter token files along with the raw data.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: extract-design-system
Download link: https://github.com/Division6066/tempo-rhythm/archive/main.zip#extract-design-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.