v0.2.2 — sync actually works now

Stop creating Figmavariables one by one.

Your design tokens. In Figma. One command.
No manual variable creation. No context switching.
designpull sync. That's it.

designpull
$ npm install -g designpull
✓ Installed designpull@0.2.2
$ designpull sync
→ Parsing design-token.md...
→ Found 49 tokens across 3 collections
→ Spawning Claude Code...
→ Writing to Figma via MCP...
✓ Created 49 variables in Figma
✓ Aliases linked (semantic → primitives)
✓ Sync complete in 14.2s
Scroll
0h
Hours saved per sync
0+
Variables created
0s
Seconds to sync
0
Manual clicks needed

Creating Figma variables by hand is soul-crushing.

You've spent hours with the design team going back and forth on how to apply this brand. Finally, you've got a high-level idea and Figma is open.

Now you need to talk to the dev team about naming conventions that work for everyone. Or if you're more the dictator type, you just tell them what they're getting. (No judgment.)

Either way, those decisions need to turn into Figma variables.

So you spend 2+ hours:
Copy hex code → Paste in Figma → Name it → Repeat 127 times.

One typo and your design system is out of sync.
One missing token and nothing works.
This shouldn't be manual labor in the year of Beyoncé's internet.

What if you could just write down your decisions and sync?
color/brand/primary: #00A7E1 → Boom. Figma variables created.

The Manual Way

Creating 49 Figma variables from design tokens

⏱ 2+ hours of tedious clicking
1Survive 3 hours of design/dev meetings
2Finally agree on naming: color/brand/primary
3Open design-token.md in VS Code
4Copy a hex value like #00A7E1
5Switch to Figma desktop app
6Click Variables panel → New variable
7Paste hex, name it manually
8Repeat 48 more times
9Try not to make typos or miss tokens
10Question your career choices
With DesignPull

Same 49 variables, zero clicking

⚡ 14 seconds, one command
1Run designpull sync in terminal
2That's it. Coffee time.
← Drag to compare →

Your tokens. In Figma. In under a minute.

DesignPull reads your design-token.md and writes directly to Figma via MCP.
Define your tokens once. Run one command. Done.

01

Run designpull init

An interactive wizard collects your brand colors, typography, and project details. Generates a design-token.md file and .env with your Figma credentials. Your token system, ready in minutes.

designpull
$ designpull init
◆ Project name?
│ DesignPull
◆ Primary brand color? (hex)
│ #00A7E1
◆ Figma file URL?
│ figma.com/design/abc123...
✓ Created design-token.md with your brand
02

Run designpull sync

Claude Code reads your design-token.md and parses every token into structured JSON. Then writes all three collections — Primitives, Semantic, Typography — directly to Figma via the official Figma MCP server. Semantic tokens are aliased to primitives automatically.

designpull
$ designpull sync
→ Parsing design-token.md...
✓ Found 49 tokens
→ Spawning Claude Code...
→ Writing to Figma via MCP...
✓ 49 variables created, aliases linked
03

Variables appear in Figma

Open your Variables panel. Every token is there — three collections, named correctly, values exact, semantic tokens aliased to primitives. You didn't click once inside Figma.

color/blue/500NEW
color/blue/600NEW
space.4NEW

Built on the Model Context Protocol

DesignPull uses Claude Code and the official Figma MCP server to bridge your CLI and Figma. When you run designpull sync, it spawns Claude Code as a subprocess, which connects to Figma's MCP server over HTTP. No local servers. No plugins. No API calls to manage.

CLI Command
designpull sync
Claude Code
subprocess
Figma MCP Server
mcp.figma.com
Figma File
Write Variables

The whole setup takes 2 minutes. Once configured, it just works. Requires a Figma paid plan and a Personal Access Token.

Hi, I'm Kayla.

I'm a Senior Design Engineer who got tired of manually creating Figma variables for every project. So I built DesignPull to automate it.

This tool saves me 2+ hours every time I start a new design system. Now you can use it too.

Why I built this

Every design system project starts the same way: hundreds of design tokens that need to become Figma variables. I was spending hours copy-pasting hex codes like a robot.

Then I discovered MCP and realized I could automate the entire thing. DesignPull is the CLI I wish I had 2 years ago.

If you work at the intersection of design and code, this tool will save you dozens of hours.

Stay Updated

Get guides, workflow templates, and updates on building design systems with DesignPull. Token architecture, MCP integration, component automation, and more.

01
Token Architecture
Primitives vs semantic tokens, naming conventions, scales
02
Automation Workflows
CLI tools, MCP servers, CI/CD pipelines for design systems
03
Component Patterns
Building flexible, composable components that scale
04
Figma ↔ Code Sync
Keeping design and code in perfect sync, forever

Install in 2 minutes.
Save hours forever.

1

Install the CLI

bash
npm install -g designpull
2

Install Claude Code

bash
npm install -g @anthropic-ai/claude-code
3

Add Figma MCP server

bash
claude mcp add --transport http figma https://mcp.figma.com/mcp -s user

This registers the official Figma MCP server with Claude Code. One-time setup.

4

Run the setup wizard

bash
designpull init

This interactive wizard walks you through configuration and runs your first sync.