Modular Scale Typography

Component Family Consistency

Dembrandt

Buttons, inputs, badges and pills share radius, colour logic, shadow, border and spacing. Use when building or reviewing a component library.

• design systems
• ui design

Extract Design System from Frontend Code

Google Stitch

Extract a comprehensive design system (DESIGN.md) directly from frontend source code — React, Vue, Svelte, Angular, plain HTML/CSS, or any web framework. Analyzes component files, stylesheets, Tailwind configs, theme definitions, and design tokens to produce a rich, Stitch-compatible design system document. Use this skill whenever the user wants to reverse-engineer a design system from an existing codebase, audit the visual language of a project, extract design tokens from source files, or understand the styling patterns in a frontend repo — even if they just say "what does this app look like?" or "pull out the design from this code."

• design systems
• documentation

Create DESIGN.md

Julien Thibeaut

Create an evidence-based DESIGN.md from a product repository or a rendered public website.

• design systems
• documentation