Kitform connector for Claude
Turn a brand guide into a Figma design system from a conversation with Claude.
What it does
The Kitform connector lets Claude read a brand guide (InDesign IDML, PDF or PowerPoint), explain what the guide does and doesn't define, fix values with you, and build the design system in your Figma file: colour variables, text styles, components, page templates and a gap report. It works alongside Figma's own connector, which Claude uses to write into the file you choose.
Before you connect
- A Kitform account. Sign up free at https://kitform-green.vercel.app/signup, or create one during the connection's sign-in step.
- Reviewing brands, gap reports and design tokens is free. Building a brand in Figma needs Kitform Build (£49 once per brand) or Studio (£99 a month). Claude tells you when a step needs a plan and where to unlock it.
- To build in Figma from Claude, also connect Figma from the Connectors directory. Without it, Claude gives you a project code for the Kitform Figma plugin instead.
Set it up
- In Claude, open Customize › Connectors and find Kitform. If it isn't listed yet, choose Add custom connector and use this URL:
https://kitform-green.vercel.app/mcp
- Select Connect. Sign in to Kitform (or create an account) and approve access. Claude can then reach only your own brands.
- In a conversation, turn Kitform on from the + › Connectors menu.
Claude Code: claude mcp add --transport http kitform https://kitform-green.vercel.app/mcp, then run /mcp to sign in.
Try asking
Create a Kitform brand from the Fieldnote sample and tell me what the guide doesn't define.
Here's our brand guide PDF. Read it with Kitform, list the colours and fonts it found, and flag anything you're unsure of.
Change the primary colour of my brand to #1F4FD8 and set the body text to 16px with 1.5 line height.
Find an open-licence stand-in for Gotham and use it for headings.
Build my brand in a new Figma file, then show me the Foundations page.
Export my brand as CSS variables for our developers.
Import our guide from this Dropbox link into the Acme team: https://www.dropbox.com/…
Tools
| Tool | What it does | Type |
|---|---|---|
| list_brands | Your brands, newest first | Read |
| create_brand_from_sample | A brand from one of three fictional sample guides | Write |
| create_brand_from_upload | A brand from a guide file Claude sends | Write |
| create_brand_from_url | A brand from a Dropbox, Google Drive, Google Slides or OneDrive link, up to 100 MB | Write |
| add_logo_from_upload | Add an SVG, PNG or JPG logo | Write |
| get_brand | Colours, fonts, styles, spacing, templates, and where each value came from | Read |
| get_gap_report | What the guide doesn't define and what was used instead | Read |
| rename_brand, update_color, add_color, update_text_style, update_font, set_spacing_and_radius | Fix values you confirm | Write |
| remove_color | Remove a colour that isn't part of the brand | Destructive |
| search_open_fonts | Search 1,950 open-licence Google Fonts families | Read |
| export_design_tokens | W3C design tokens JSON or CSS variables | Read |
| get_figma_build_script | The script Claude runs with Figma's connector to build the design system | Read (needs Build or Studio) |
| get_figma_plugin_setup | Steps and a project code for the Kitform Figma plugin | Read (needs Build or Studio) |
| delete_brand | Delete a brand from Kitform (Figma files are untouched) | Destructive |
There's also a prompt, build_brand_in_figma, which runs the whole review-then-build flow.
Troubleshooting
- "Building this brand in Figma needs Kitform Build…": open the link in the message to unlock the brand, then ask Claude to try again.
- File too large: Claude can send guides up to about 3 MB. For bigger ones (up to 100 MB), share a Dropbox, Google Drive or OneDrive link and ask Claude to import it, or upload on the Kitform website.
- Team brands: Claude sees your own brands and those of every team you're in. To add a brand to a team, name the team: "Import this guide into the Acme team."
- "Could not read the file": check the file is complete and not password-protected. Scanned PDFs without text give fewer results.
- Claude can't build in Figma: connect Figma's connector and make sure you can edit the target file, or use the Kitform Figma plugin.
- Fonts look different in Figma: licensed brand fonts are set in open-licence stand-ins by default; the gap report lists each one. Ask Claude to build with use_brand_fonts if your Figma has the fonts.
- Sign-in loops or "unauthorised": disconnect Kitform in Claude and connect again.
Privacy and support
Kitform receives only what each tool call contains and never your conversations. See the privacy policy. Help and security reports: support-email-not-set@example.com.