Codigma Mcp Server
What is Codigma Mcp Server
Codigma MCP Server is the backend service for Codigma.io, a free tool that converts public Figma links into clean, semantic HTML and CSS.
Use cases
Use cases include transforming Figma design prototypes into production-ready HTML/CSS, creating design systems, and streamlining the workflow for developers and designers.
How to use
To use Codigma MCP Server, clone the repository, install dependencies, add your Figma API token in a .env file, and then run the server in either development or production mode.
Key features
Key features include fetching Figma public file data, converting Figma designs into structured Codigma Models, generating clean HTML and CSS code, and supporting responsive design with options for TailwindCSS.
Where to use
Codigma MCP Server is primarily used in web development, particularly for converting design files from Figma into usable web code.
Clients Supporting MCP
The following are the main client software that supports the Model Context Protocol. Click the link to visit the official website for more information.
Overview
What is Codigma Mcp Server
Codigma MCP Server is the backend service for Codigma.io, a free tool that converts public Figma links into clean, semantic HTML and CSS.
Use cases
Use cases include transforming Figma design prototypes into production-ready HTML/CSS, creating design systems, and streamlining the workflow for developers and designers.
How to use
To use Codigma MCP Server, clone the repository, install dependencies, add your Figma API token in a .env file, and then run the server in either development or production mode.
Key features
Key features include fetching Figma public file data, converting Figma designs into structured Codigma Models, generating clean HTML and CSS code, and supporting responsive design with options for TailwindCSS.
Where to use
Codigma MCP Server is primarily used in web development, particularly for converting design files from Figma into usable web code.
Clients Supporting MCP
The following are the main client software that supports the Model Context Protocol. Click the link to visit the official website for more information.
Content
Codigma MCP Server
Welcome to the Codigma MCP Server repository!
Codigma MCP Server is the backend service behind Codigma.io — a free tool that helps you easily turn any public Figma link into clean, semantic HTML and CSS.
You just paste your Figma link, and Codigma.io does the rest!
🔄 What You Can Do
- Fetch Figma public file data.
- Convert Figma designs into structured Codigma Models.
- Generate clean, semantic HTML and CSS code.
- Optionally generate TailwindCSS class-based HTML.
- Support for responsive design, fonts, borders, shadows, and gradients.
📚 Quick Start
1. Clone the repository
git clone https://github.com/rastmob/codigma-mcp-server.git
cd codigma-mcp-server
2. Install dependencies
npm install
3. Add Figma API token
Create a .env file:
FIGMA_PERSONAL_ACCESS_TOKEN=your_figma_token_here
4. Run the server
Development mode
npm run dev
Production mode
npm run build npm start
🌐 Main API Endpoints
| Endpoint | Method | Description |
|---|---|---|
/api/fetch-figma-data |
POST | Fetch public Figma file JSON data. |
/api/map-figma-node |
POST | Convert Figma Node to Codigma Model. |
/api/generate-html |
POST | Create HTML from Codigma Model. |
/api/generate-css |
POST | Create CSS from Codigma Model. |
/api/generate-bundle |
POST | Create full bundle (HTML + CSS). |
/api/figma-to-bundle |
POST | Full process from Figma URL to code output (supports TailwindCSS too). |
📅 Example
POST /api/figma-to-bundle
Request Body:
Response:
- Codigma Model (structured)
- HTML + CSS bundle (or TailwindCSS HTML)
🔧 Technology
- Node.js 18+
- Express 5
- TypeScript
- Axios
- Jest (for tests)
- ESLint (for code quality)
📊 Roadmap
- ✅ Fetch public Figma files
- ✅ TailwindCSS output option
- ✅ Font, border, shadow support
- ⬆️ Better responsive support
- ⬆️ OAuth login for private files
- ⬆️ Snapshot and versioning features
- ⬆️ Admin Dashboard
👤 About the Author
Mehmet Alp
Founder of Rast Mobile
- GitHub: @rastmob
- Email: [email protected]
📄 License
Licensed under the ISC License.
📈 Contributing
We welcome pull requests!
Fork the repo → Create a branch → Commit your changes → Open a pull request → Done! 📚
🐝 Reporting Bugs
Found a bug? Please open an issue here.
Thanks for using Codigma MCP Server!
And don’t forget to try Codigma.io for FREE!
Dev Tools Supporting MCP
The following are the main code editors that support the Model Context Protocol. Click the link to visit the official website for more information.
