Back to browse
Claude CodeComputer Use

Design Token Extractor

Extract a complete token set from any website or codebase

Intermediate30 min8.4k downloads4.5
design/Tokens
DesignerSoftware Engineer
terminal
claude install community/design-token-extractor
by design-ops

About this skill

Reverse-engineer design systems: scan CSS/Tailwind files or live websites to extract color palettes, font stacks, spacing scales, and shadow values into token formats.

Capabilities

  • file editing
  • computer use
  • code execution

Use cases

  • Token extraction
  • Design system audit
  • Style documentation

Tags

tokensdesign-systemcssextraction

Developers also use

Skills frequently paired with Design Token Extractor

Discover more →
55% match
Computer UseClaude Code

Responsive Tester

Test responsive layouts at every breakpoint with visual proof

Both used by Designer, Software Engineer

Beginner6.8k
51% match
Claude CodeComputer Use

Accessibility Audit

Run a full WCAG 2.2 accessibility audit with actionable fixes

Both used by Designer, Software Engineer

Beginner10.2k
49% match
Claude CodeMCP

Figma to Code

Convert Figma designs to production code with proper responsive handling

Both used by Designer, Software Engineer

Intermediate16.2k
47% match
Computer Use

Visual A11y Tester

Test accessibility by navigating your app with keyboard-only input

Both used by Designer, Software Engineer

Beginner5.4k
45% match
Claude CodeCursor

Design System Builder

Build a complete design system from a brand guide automatically

Both used by Designer, Software Engineer

Intermediate14.8k
45% match
Claude CodeCursor

Animation Library

Create smooth, performant animations with CSS, Framer Motion, or GSAP

Both used by Designer, Software Engineer

Intermediate9.6k