[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3884":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":25,"hasPages":23,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":32,"readmeContent":33,"aiSummary":34,"trendingCount":16,"starSnapshotCount":16,"syncStatus":35,"lastSyncTime":36,"discoverSource":37},3884,"Figma-Context-MCP","GLips\u002FFigma-Context-MCP","GLips","MCP server to provide Figma layout information to AI coding agents like Cursor","https:\u002F\u002Fwww.framelink.ai\u002F",null,"TypeScript",15078,1195,60,10,0,15,84,366,77,44.23,"MIT License",false,"main",true,[27,28,29,30,31],"ai","cursor","figma","mcp","typescript","2026-06-12 02:00:55","\u003Ca href=\"https:\u002F\u002Fwww.framelink.ai\u002F?utm_source=github&utm_medium=referral&utm_campaign=readme\" target=\"_blank\" rel=\"noopener\">\n  \u003Cpicture>\n    \u003Csource media=\"(prefers-color-scheme: dark)\" srcset=\"https:\u002F\u002Fwww.framelink.ai\u002Fgithub\u002FHeaderDark.png\" \u002F>\n    \u003Cimg alt=\"Framelink\" src=\"https:\u002F\u002Fwww.framelink.ai\u002Fgithub\u002FHeaderLight.png\" \u002F>\n  \u003C\u002Fpicture>\n\u003C\u002Fa>\n\n\u003Cdiv align=\"center\">\n  \u003Ch1>Framelink MCP for Figma\u003C\u002Fh1>\n  \u003Ch3>Give your coding agent access to your Figma data.\u003Cbr\u002F>Implement designs in any framework in one-shot.\u003C\u002Fh3>\n  \u003Ca href=\"https:\u002F\u002Fnpmcharts.com\u002Fcompare\u002Ffigma-developer-mcp?interval=30\">\n    \u003Cimg alt=\"weekly downloads\" src=\"https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdm\u002Ffigma-developer-mcp.svg\">\n  \u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fgithub.com\u002FGLips\u002FFigma-Context-MCP\u002Fblob\u002Fmain\u002FLICENSE\">\n    \u003Cimg alt=\"MIT License\" src=\"https:\u002F\u002Fimg.shields.io\u002Fgithub\u002Flicense\u002FGLips\u002FFigma-Context-MCP\" \u002F>\n  \u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fframelink.ai\u002Fdiscord\">\n    \u003Cimg alt=\"Discord\" src=\"https:\u002F\u002Fimg.shields.io\u002Fdiscord\u002F1352337336913887343?color=7389D8&label&logo=discord&logoColor=ffffff\" \u002F>\n  \u003C\u002Fa>\n  \u003Cbr \u002F>\n  \u003Ca href=\"https:\u002F\u002Ftwitter.com\u002Fglipsman\">\n    \u003Cimg alt=\"Twitter\" src=\"https:\u002F\u002Fimg.shields.io\u002Ftwitter\u002Furl?url=https%3A%2F%2Fx.com%2Fglipsman&label=%40glipsman\" \u002F>\n  \u003C\u002Fa>\n\u003C\u002Fdiv>\n\n\u003Cbr\u002F>\n\nGive [Cursor](https:\u002F\u002Fcursor.sh\u002F) and other AI-powered coding tools access to your Figma files with this [Model Context Protocol](https:\u002F\u002Fmodelcontextprotocol.io\u002Fintroduction) server.\n\nWhen Cursor has access to Figma design data, it's **way** better at one-shotting designs accurately than alternative approaches like pasting screenshots.\n\n\u003Ch3>\u003Ca href=\"https:\u002F\u002Fwww.framelink.ai\u002Fdocs\u002Fquickstart?utm_source=github&utm_medium=referral&utm_campaign=readme\">See quickstart instructions →\u003C\u002Fa>\u003C\u002Fh3>\n\n## Demo\n\n[Watch a demo of building a UI in Cursor with Figma design data](https:\u002F\u002Fyoutu.be\u002F6G9yb-LrEqg)\n\n[![Watch the video](https:\u002F\u002Fimg.youtube.com\u002Fvi\u002F6G9yb-LrEqg\u002Fmaxresdefault.jpg)](https:\u002F\u002Fyoutu.be\u002F6G9yb-LrEqg)\n\n## How it works\n\n1. Open your IDE's chat (e.g. agent mode in Cursor).\n2. Paste a link to a Figma file, frame, or group.\n3. Ask Cursor to do something with the Figma file—e.g. implement the design.\n4. Cursor will fetch the relevant metadata from Figma and use it to write your code.\n\nThis MCP server is specifically designed for use with Cursor. Before responding with context from the [Figma API](https:\u002F\u002Fwww.figma.com\u002Fdevelopers\u002Fapi), it simplifies and translates the response so only the most relevant layout and styling information is provided to the model.\n\nReducing the amount of context provided to the model helps make the AI more accurate and the responses more relevant.\n\n## Getting Started\n\nMany code editors and other AI clients use a configuration file to manage MCP servers.\n\nThe `figma-developer-mcp` server can be configured by adding the following to your configuration file.\n\n> NOTE: You will need to create a Figma access token to use this server. Instructions on how to create a Figma API access token can be found [here](https:\u002F\u002Fhelp.figma.com\u002Fhc\u002Fen-us\u002Farticles\u002F8085703771159-Manage-personal-access-tokens).\n\n### MacOS \u002F Linux\n\n```json\n{\n  \"mcpServers\": {\n    \"Framelink MCP for Figma\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"figma-developer-mcp\", \"--figma-api-key=YOUR-KEY\", \"--stdio\"]\n    }\n  }\n}\n```\n\n### Windows\n\n```json\n{\n  \"mcpServers\": {\n    \"Framelink MCP for Figma\": {\n      \"command\": \"cmd\",\n      \"args\": [\"\u002Fc\", \"npx\", \"-y\", \"figma-developer-mcp\", \"--figma-api-key=YOUR-KEY\", \"--stdio\"]\n    }\n  }\n}\n```\n\nOr you can set `FIGMA_API_KEY` and `PORT` in the `env` field.\n\nIf you need more information on how to configure the Framelink MCP for Figma, see the [Framelink docs](https:\u002F\u002Fwww.framelink.ai\u002Fdocs\u002Fquickstart?utm_source=github&utm_medium=referral&utm_campaign=readme).\n\n## Star History\n\n\u003Ca href=\"https:\u002F\u002Fstar-history.com\u002F#GLips\u002FFigma-Context-MCP\">\u003Cimg src=\"https:\u002F\u002Fapi.star-history.com\u002Fsvg?repos=GLips\u002FFigma-Context-MCP&type=Date\" alt=\"Star History Chart\" width=\"600\" \u002F>\u003C\u002Fa>\n\n## Learn More\n\nThe Framelink MCP for Figma is simple but powerful. Get the most out of it by learning more at the [Framelink](https:\u002F\u002Fframelink.ai?utm_source=github&utm_medium=referral&utm_campaign=readme) site.\n","Figma-Context-MCP 是一个为 AI 编码助手（如 Cursor）提供 Figma 设计布局信息的 MCP 服务器。其核心功能在于通过 Model Context Protocol 协议，将 Figma 文件中的设计数据转换成简洁且相关的布局与样式信息，从而使得 AI 能够更准确地一次性实现设计。项目采用 TypeScript 开发，并支持 MIT 许可证。适用于需要快速将 Figma 设计转化为代码的各种开发场景，特别是当开发者希望利用 AI 工具提高从设计到编码的工作效率时。",2,"2026-06-11 02:56:55","top_language"]