Start here

Not sure where to begin?

Pick the path that matches where you are. Each one walks you through the library in a specific order.

1

Read this first

Safe AI for Designers: the five rules

Twelve minutes that save you from leaking API keys, breaking production, or pasting customer data into AI. Plain English, no scare tactics. Do this before you install anything.

→ Five rules to start with (12 min)

2

Brand new to AI

I have never used Claude or Cursor

Start with Claude Code set up from zero. Twenty minutes, no coding experience needed. By the end you will have run your first real AI audit.

→ Set up Claude Code (20 min)

3

Bridge design and code

I want AI to read my Figma files

Connect Figma directly to Claude or Cursor via MCP. Ask questions about your designs, generate code, pull component data. Works with the new bidirectional sync.

→ Figma MCP setup (15 min)

4

Run your first audit

I want to audit my design system

Run a full token, component, and accessibility audit in 30 minutes. No spreadsheets. Output is a prioritized fix list you can share with your team.

→ Audit a design system in 30 minutes

5

Make it machine-readable

I want my system to work with AI out of the box

Drop the starter kit into your project. Path-scoped rules, a knowledge graph, and component intent maps. Claude understands your system from the first prompt.

→ Download the Agentic Design System Starter Kit

6

Go deeper

I want to build custom Claude Code skills for my team

Learn how to build Claude Code skills that encode your team's conventions. Then install three ready-made ones for token audits, parity checks, and component reviews.

→ How to create custom skills for Claude Code

Weekly newsletter

Get the weekly DSG newsletter.

One practical guide each week: prompts, Codex and Claude notes, design-system automation, and tools worth trying.

Opens Substack. Unsubscribe anytime.