daisyUI v5.6 is now available!

Setup Figma API for Blueprint MCP

Generate daisyUI code from a Figma design file

Step 1: Get a Figma Access Token

In Figma, go to Settings > Security > Personal Access Tokens > Generate new token.

Required permissions:

  • file_content:read
  • file_metadata:read
  • library_assets:read
  • library_content:read
  • team_library_content:read
  • file_dev_resources:read

Step 2: Add the token to Blueprint MCP

Set the Figma API token in the FIGMA environment variable for the Blueprint MCP server. 
"daisyui-blueprint": {
  "type": "stdio",
  "command": "npx",
  "env": {
    "LICENSE": "YOUR LICENSE KEY",
    "EMAIL": "YOUR EMAIL",
    "FIGMA": "YOUR FIGMA API KEY"
  }
}
In Figma, right click on a section and choose Copy/Paste as > Copy link to selection.

Step 4: Ask your editor to generate daisyUI code

In your editor, paste the link and ask the LLM to generate daisyUI code for that design.

Do you have a question? Ask on GitHub or Discord server
Do you see a bug? open an issue on GitHub
Do you like daisyUI? Post about it!
Support daisyUI's development: Open Collective
Please upgrade your browser