Skip to content
.mdDesign.md Store

Docs / Integrations

Cursor

Cursor does not read DESIGN.md automatically. You reference the file explicitly in your prompts — either as a context attachment or via .cursorrules.

Option 1 — Attach in Composer

In Cursor’s Composer (Cmd+I), type @ and select your DESIGN.md file from the file picker. This attaches the full file to the current prompt as context:

@DESIGN.md Build a settings page with a sidebar navigation.
Use the card and button-primary tokens from the design system.

You can attach DESIGN.mdalongside other files. Cursor will include all attached files in the model’s context window.

Tip: When you attach @DESIGN.md at the start of a Composer thread, all follow-up messages in that thread retain the file in context. You only need to attach it once per session.

Option 2 — .cursorrules

Cursor reads a .cursorrules file from the project root and includes its contents in every AI request automatically. Use it to import your design spec as a persistent rule:

# .cursorrules

## Design system
Always follow the design system defined in DESIGN.md.
Key rules:
- Use only the color tokens defined under `colors` in DESIGN.md
- Use only the spacing tokens defined under `spacing` in DESIGN.md
- Button styles must match the component tokens in DESIGN.md exactly
- Never use hardcoded hex values — reference tokens by name

## Typography
Use the fontFamily values from DESIGN.md's typography section.
Do not introduce new font families.

You can also paste the content of DESIGN.md directly into .cursorrules if you want Cursor to have the full token table without requiring manual attachment. However, this increases the size of every request — for large design systems, prefer the explicit @DESIGN.md attachment approach.

Option 3 — Project-level context via Cursor Settings

In Cursor Settings → Features → Codebase Indexing, you can ensure your repo is fully indexed. Once indexed, Cursor can find references to your token names automatically — though for reliable results with design tokens, explicit attachment is still recommended.

Verifying Cursor reads the file

After attaching @DESIGN.md, test that Cursor understands your tokens:

@DESIGN.md What is the background color of the primary button
in this design system?

Cursor should return the exact value from your components.button-primary.backgroundColor token.

Tips for best results

  • Attach @DESIGN.md at the start of each Composer session — it persists for the thread.
  • Reference specific sections in your prompt for targeted results:“Using the components section of @DESIGN.md, build a card with a badge.”
  • Use .cursorrules for hard constraints (no hardcoded colours) and @DESIGN.md attachment for full token context.
  • Keep DESIGN.md concise. Every line is loaded into the context window — shorter files leave more room for your code.
Claude CodeFigma