D-ZERO

Provides an MCP server to fetch Figma data, deliver coding guidelines, and integrate with CLINE for AI-assisted frontend development.

typescript

GitHub Stars

typescript

Language

6 months ago

First Indexed

2 months ago

Catalog Refreshed

Documentation & install

Readme and setup notes from the catalogue, plus a client-ready config you can copy for your MCP host.

Installation

Add the following to your MCP client configuration file.

Configuration

View docs

{
  "mcpServers": {
    "d-zero-dev-mcp-server": {
      "command": "npx",
      "args": [
        "-y",
        "@d-zero/mcp-server"
      ],
      "env": {
        "FIGMA_TEST_URL": "https://www.figma.com/file/abcdef123456/FileName",
        "FIGMA_ACCESS_TOKEN": "abcd_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
      }
    }
  }
}

This MCP server provides access to Figma data, delivers coding guidelines for D-ZERO frontend development, and integrates with CLINE to enable AI-assisted conversations. It streamlines retrieving design data and applying development standards within your AI workflow.

How to use

You connect to the MCP server through your MCP client to access three core capabilities: retrieve Figma file and node data, fetch coding guidelines for D-ZERO frontend development, and interact with the AI assistant via CLINE. Use these capabilities in conversations with the AI assistant to reference design assets, confirm coding standards, and get contextual guidance during development.

How to install

Prerequisites: ensure you have Node.js and npm installed on your machine. You will use a local runtime via npx to start the MCP server.

Create or edit your MCP server configuration file to enable the coding guidelines server.

{
  "mcpServers": {
    "coding_guidelines": {
      "command": "npx",
      "args": ["-y", "@d-zero/mcp-server"],
      "env": {
        "FIGMA_ACCESS_TOKEN": "abcd_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
      },
      "disabled": false,
      "autoApprove": []
    }
  }
}

Additional notes

Environment variables shown here control access to Figma data and enable test flows. Obtain a Figma access token from the Figma API to authenticate requests. You may also specify a test URL for Figma resources if you want to run isolated tests.

Security and maintenance

Keep your FIGMA_ACCESS_TOKEN secret. Rotate tokens periodically and restrict token scope to necessary resources. When you update the configuration, restart the MCP client to apply changes.

Available tools

fetch_figma_data

Retrieves Figma file and node data via the Figma API to supply design details to the AI assistant.

coding_guidelines

Provides D-ZERO frontend development guidelines to the AI assistant for reference during conversations.

cline_integration

Enables AI-assisted conversations by integrating with CLINE as an MCP server endpoint.

Built by

VeilStrat

AI signals for GTM teams