Back to PortfolioDesign Cortex
An open-source, MCP-native tool that turns a Figma design system into an AI-readable knowledge base.
Agents that query Figma at runtime are slow, expensive, and unpredictable. Design Cortex does a one-time extraction into a structured markdown knowledge base, so the agent reads local files instead of hitting Figma mid-task. Figma stays the source of truth; the knowledge base is the interface between your design system and the agent. MCP-agnostic, no infrastructure, MIT licensed.
Introduction
Design Cortex is an open-source tool I built that extracts a Figma design system into portable markdown an AI agent can read directly. Instead of querying Figma live on every task, you point it at your system once and get a fast, local source of truth. It runs entirely through MCP: no API keys, no Python, no services to stand up.
Impact
extraction powers every task, so token cost stays flat
infrastructure: no API keys, no Python, no external services
generator skills: extract, write, refresh, validate
MIT licensed and MCP-agnostic, works with any Figma MCP
Goals
- Make a design system consumable by agents without live Figma access
- Keep token cost predictable as tasks scale
- Keep Figma canonical while the knowledge base stays a derived artifact
The problem: agents shouldn't hit Figma on every task
Most AI design workflows have agents querying Figma on every task. That gets slow, expensive, and unreliable fast, especially at scale where a single request can pull far more than the agent needs. The fix is to decouple extraction from consumption: pull the system once, structure it well, and let agents reference it locally for as long as it stays fresh.
Four skills, one job each
ds-extract crawls Figma, caches the raw data, and produces a gap report.
ds-write converts that cache into a full markdown knowledge base.
ds-refresh re-extracts and updates only the components that changed.
ds-validate checks completeness, references, and freshness.
Each skill fires from a plain-language trigger, as the table shows. Configuration lives in a single .ds-kb-config.json file, so the whole pipeline is reproducible.
A two-tier knowledge base keeps tokens flat
Agents load a top-level index.json table of contents, then a component index.md, then only the specific variant files they need. That layering is what keeps token usage flat. The clip shows the generated knowledge base: real markdown, readable by humans and agents alike.
kb-output/ index.json - table of contents tokens/ - color, typography, spacing patterns/ - composition and accessibility rules components/ - atoms, molecules, organisms _review/ - components needing classification
Figma stays the source of truth
Design Cortex treats the knowledge base as a derived artifact, not a second source of truth. Figma stays canonical, the knowledge base is regenerated from it, and the refresh step keeps the two in sync without clobbering anything a human edited by hand. Because it's MCP-agnostic and dependency-free, it drops into any agent setup: Cursor, Claude Code, or anything else that speaks MCP. Released under MIT so the community can build on it.
