daisyUI Blueprint

Blueprint is the official daisyUI MCP server.

Features

• Page-specific guidance for websites, apps, dashboards, and workflows
• Exact daisyUI component and block syntax
• Installation, configuration, color, and theme rules
• Quality checks for daisyUI classes, structure, responsive behavior, content, and common UI anti-patterns
• Figma structure and node previews
• Workflows for converting screenshots, Bootstrap, and Tailwind CSS to daisyUI
• Custom daisyUI themes generated from image palettes

How it helps

• Gives your AI agent the right page context before it writes code
• Prevents made-up class names and invalid component markup
• Keeps generated interfaces consistent with daisyUI 5
• Produces more specific content and fewer generic AI-style layouts
• Checks the finished UI and reports issues before the task is complete

How to use it

Get a daisyUI Blueprint license, then add the server to your MCP client:

{
  "mcpServers": {
    "daisyui-blueprint": {
      "command": "npx",
      "args": ["-y", "daisyui-blueprint@latest"],
      "env": {
        "LICENSE": "your-license-key",
        "EMAIL": "[email protected]"
      }
    }
  }
}

Add a FIGMA environment variable if you want to use Figma integration. Blueprint also accepts these optional runtime settings:

| Variable | Default | Description | | --- | ---: | --- | | MAX_PAGES | 5 | Maximum Page Architect page IDs returned or accepted per call. | | MAX_COMPONENT_RESPONSE_CHARS | 24000 | Maximum serialized Component Syntax Expert response size in characters. The first requested entry is always returned even if it alone exceeds the budget. | | MAX_COMPONENT_SKIPS | 7 | Maximum components from selected Page Architect pages that may omit syntax retrieval. | | QA_MAX_FILES | 300 | Maximum files Quality Inspector may audit per call. | | QA_MAX_MB | 2 | Maximum total megabytes Quality Inspector may audit per call. | | FIGMA_TIMEOUT | 15 | Figma API request timeout in seconds. | | SKIP_SETUP_EXPERT | false | Set to true to skip Setup Expert. | | SKIP_RULES_ENFORCER | false | Set to true to skip Rules Enforcer. | | SKIP_PAGE_ARCHITECT | false | Set to true to skip Page Architect. | | SKIP_CREATIVE_DIRECTOR | false | Set to true to skip Creative Director. | | SKIP_COMPONENT_SYNTAX_EXPERT | false | Set to true to skip Component Syntax Expert. | | SKIP_QUALITY_INSPECTOR | false | Set to true to skip Quality Inspector. |

Component Syntax Expert accepts the full list of component and block IDs needed for a change, but returns as many ordered entries as fit within MAX_COMPONENT_RESPONSE_CHARS. It stops before the next entry would exceed the serialized response budget. When its next step lists remaining SnippetIDs, call it again with the same workflowId and all listed IDs. Repeat until the final batch advances to implementation and, for non-conversion workflows, Quality Inspector. A single entry is always returned so an unusually large component cannot stall the workflow.

MCP clients receive the workflow instructions during initialization, before tool use:

• Respect the user's explicit scope: a page, section, component, or specific UI change.
• For a new project, build a complete UI with multiple pages unless the user explicitly limits the scope. A short request or a product name does not imply a single page.
• For that full project, write a page plan before the first Blueprint tool call. List each page's name, route, and purpose based on the user's goal and main tasks.
• Spawn one sub-agent per planned page. Each must start a new workflow with a distinct workflowId.
• Select one shared Creative Director configuration before page work starts. All page sub-agents in the same project must use the same options and design trend.
• For a full project, build every planned page with its own route and connect navigation to those routes. Same-page sections, placeholder links, and dialogs do not replace required pages.
• For a full project, open every planned route and check its content and navigation. Do not report completion until every planned page is implemented, reachable, and verified. List the completed page routes in the final response.

Creative Director and Page Architect are mandatory when the agent creates a new complete page or screen. Call Creative Director first, then Page Architect. Both tools are optional for other tasks. Conversion workflows skip both tools. Component Syntax Expert remains mandatory before markup.

A Page Architect call with only context returns page options. It preserves the active page selection and retrieved syntax. Call Page Architect again with the chosen PageIDs before Component Syntax Expert. Only the explicitly selected pages create component requirements.

Inspector checks static component use only in the supplied files. A component that is absent from those files can exist elsewhere in the page. These absence findings are advisory and do not require extra components or a wider edit scope. Missing required syntax calls remain blocking findings.

For Quality Inspector, use auditIntent: "fix_changes" after Blueprint edits UI code; findings may then be fixed only within the supplied changed scope. Use auditIntent: "report_only" only when the user explicitly requests a read-only audit, and report findings without editing files. Every files[].path must be relative to the projectRoot stored by Setup Expert, such as src/App.tsx or .; never pass an absolute path.

Blueprint creates one design by default. It creates variants only when the user explicitly asks for them. Use separate sub-agents when the client supports them and capacity is available. Otherwise, create the variants sequentially in the same agent. Each variant must use a distinct workflowId and start with Setup Expert. Give parallel variants separate files. Assign one coordinator to shared files.

When Creative Director supplies guidance, record four planning decisions before implementation. Pass the current concept, domainAnchor, signatureElement, and compositionRule values to each fix_changes audit in originalityEvidence. Update the values if the design decisions change. Include an intentional monochromatic, tone-on-tone, or material palette in the relevant planning decision. Inspector uses this evidence and the original userRequest to check repeated anchor colors. Keep userRequest faithful to the user's request; put your own design decisions in originalityEvidence. Quality Inspector validates the four fields and returns a workflow finding when they are missing. SKIP_CREATIVE_DIRECTOR=true and report_only audits do not require these fields. When Creative Director supplied guidance, the fields remain required if a browser is unavailable.

These caller-provided decisions are planning records, not proof of originality. Quality Inspector does not verify when they were written, enforce unchanged values, or confirm that the UI implements them. Rendered review remains a separate check.

Then ask your AI agent to use daisyUI Blueprint:

• "Build a product management dashboard. Use daisyUI Blueprint."
• "Recreate this screenshot with daisyUI Blueprint."
• "Convert this Bootstrap form to daisyUI."
• "Create a daisyUI theme from this image."
• "Check my UI with daisyUI Blueprint and fix the issues."