Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Generate images with any major model — one API key, one prepaid balance, one MCP.
쓰고 있는 AI 앱을 고른 다음 설정을 복사하세요.
검사 4/5 통과 · 내가 묻는 내용은 제작자 서버(mcp.pixfaro.com)를 거쳐요 · ✓ 명령 확인 2026년 11월 13일
먼저: 어떤 AI를 쓰시나요?
쓰는 앱을 고르면 아래에 단계가 나옵니다.
Claude에 연결할 수 있어요 · 약 2분
키 필요 없음, 설치 필요 없음 · claude.ai나 데스크톱 앱에서 한 번 설정하면 채팅에서 쓸 수 있어요 · 무료 계정은 1개까지 · Team/Enterprise는 소유자(Owner)가 추가
CustomizeConnectors
여기서 복사해 Claude의 같은 이름 칸에 붙여 넣고 Continue를 누르세요
Pixfaro MCPhttps://mcp.pixfaro.com/mcpClaude가 찾은 로그인 설정 화면에서 Continue를 누르고 · Authentication은 제작자 안내대로(Sign in now, Sign in when needed, No sign in) 고른 뒤 Add를 누르세요
+ConnectorsPixfaro MCP
Pixfaro MCP을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Claude가 Pixfaro MCP을 쓰고 있다고 하거나 답에 Pixfaro MCP 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Anthropic 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
ChatGPT 연결은 요금제에 따라 달라요
전체 MCP: 웹 ChatGPT Business, Enterprise, Edu · Pro: 읽기/가져오기 권한으로 연결, 데이터를 바꾸는 도구는 안 될 수 있어요 · Plus: 공식 문서 미확인, 플러그인 화면에 사용자 지정 MCP 추가 항목이 보이면 시도해 볼 수 있어요 · 웹만
Plugins+Add custom MCP server
이름을 넣고 Connection에 주소를 붙여 넣은 뒤 경고에 체크하고 Create as a plugin을 누르세요
Pixfaro MCPhttps://mcp.pixfaro.com/mcp새 채팅을 열고 입력 전에 플러그인 목록에서 Pixfaro MCP을 고르세요
Pixfaro MCP을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ ChatGPT가 Pixfaro MCP을 쓰고 있다고 하거나 답에 Pixfaro MCP 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 OpenAI 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
Claude Code에 연결할 수 있어요 · 약 2분
키 필요 없음, 설치 필요 없음
Mac: Command+스페이스를 누르고 Terminal 입력 · Windows: PowerShell 열기
claude mcp add --transport http --scope user pixfaro https://mcp.pixfaro.com/mcpPixfaro MCP이 목록에 있고 연결됨으로 보이면 돼요
Pixfaro MCP을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Claude Code가 Pixfaro MCP을 쓰고 있다고 하거나 답에 Pixfaro MCP 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Anthropic 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
Cursor에 연결할 수 있어요 · 약 2분
키 필요 없음, 설치 필요 없음
Pixfaro MCP을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Cursor가 Pixfaro MCP을 쓰고 있다고 하거나 답에 Pixfaro MCP 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Cursor 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
VS Code에 연결할 수 있어요 · 약 2분
키 필요 없음, 설치 필요 없음
Pixfaro MCP을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ VS Code가 Pixfaro MCP을 쓰고 있다고 하거나 답에 Pixfaro MCP 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 VS Code 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
Windsurf, Zed, Gemini CLI 같은 다른 MCP 앱은 추가 방법이 저마다 달라요. 앱 목록에서 확인하세요
웹으로 연결하는 앱용 주소
https://mcp.pixfaro.com/mcpJSON 설정은 아래 “개발자용”에 있어요
Claude Code
claude mcp add --transport http --scope user pixfaro https://mcp.pixfaro.com/mcpCursor (~/.cursor/mcp.json)
{
"mcpServers": {
"pixfaro": {
"url": "https://mcp.pixfaro.com/mcp"
}
}
}VS Code (mcp.json)
{
"servers": {
"pixfaro": {
"type": "http",
"url": "https://mcp.pixfaro.com/mcp"
}
}
}Claude Code
claude mcp add --scope user pixfaro --env PIXFARO_KEY=your-value -- npx -y @pixfaro/mcpClaude Desktop (claude_desktop_config.json)
{
"mcpServers": {
"pixfaro": {
"command": "npx",
"args": [
"-y",
"@pixfaro/mcp"
],
"env": {
"PIXFARO_KEY": "your-value"
}
}
}
}Cursor (~/.cursor/mcp.json)
{
"mcpServers": {
"pixfaro": {
"command": "npx",
"args": [
"-y",
"@pixfaro/mcp"
],
"env": {
"PIXFARO_KEY": "your-value"
}
}
}
}VS Code (mcp.json)
{
"servers": {
"pixfaro": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@pixfaro/mcp"
],
"env": {
"PIXFARO_KEY": "your-value"
}
}
}
}PIXFARO_KEY 비밀 필수 env이 설정은 제작자의 레지스트리 정보로 만들었어요. README와 다르면 README를 따르세요.
npm: @pixfaro/mcp이 서버의 연결 방식과 각 앱의 공식 문서를 바탕으로 했어요. 2026년 11월 10일 확인.
인터넷으로 연결하는 앱
ClaudeChatGPTGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatOpen WebUIRaycast
내 컴퓨터에서 실행하는 앱
ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast
도구 이름과 설명은 서버가 2026년 11월 10일에 알려 준 그대로예요. 우리가 아니라 제작자가 쓴 글이고, 일반 텍스트로만 보여 드려요.
generate_imageGenerate an image from a text prompt. Returns a hosted URL plus cost and balance. Slow models (mode "async" in list_models) return a j_… job id instead — poll it with check_job.
edit_imageEdit a previously generated image by its img_… id with a natural-language instruction.
render_templateRender a typeset card from a template — a finished, on-brand social image (quote card, post card) in about two seconds. Cheaper and more legible than generating type with a model. Get the templates and their slots from list_templates.
upload_assetUpload an image (PNG or JPEG, ≤5 MB) as a reusable asset — an avatar for a card, for example. Returns an ast_… id to pass into a template slot.
list_modelsList available image models with pricing and latency.
list_templatesList card templates with their slots, style axes and exact price.
get_balanceShow the current prepaid balance in USD.
check_jobCheck an async generation job by its j_… id. Slow models (mode "async" in list_models) return a job instead of an image — poll this until it succeeds or fails.
누구나 볼 수 있는 정보를 점검했고, 코드는 읽지 않았어요. 해당하지 않는 항목은 개수에서 뺐어요. · 2026년 11월 13일 점검
질문하고, 팁을 나누고, 안 되는 점을 알려 주세요. "도움이 됨"이 많은 순서예요.
아직 리뷰가 없어요
레지스트리에서 이 카테고리의 활성 서버 전체와 비교했어요. 스타는 게시자가 저장소를 소유한 경우에만 세요.
해당하는 기본 점검 5개 중 4개를 통과했어요. 코드는 읽지 않았어요. 키나 토큰을 넣기 전에 서버가 어떤 권한을 요구하는지 확인하고, 꼭 필요한 권한만 있는 키를 쓰세요.
입력해야 할 값: PIXFARO_KEY
둘 다 가능해요. 내 컴퓨터에 설치해도 되고, 클라우드 버전에 연결해도 돼요.
GitHub 저장소는 마지막으로 그저께 변경됐고, 최신 버전(0.1.3)은 그저께 레지스트리에 올라왔어요.
Claude Desktop, Claude Code, Cursor, VS Code처럼 MCP를 지원하는 앱에서 쓸 수 있어요. URL로 연결되므로 원격 MCP를 받는 앱에서도 쓸 수 있어요. 예: 웹 ChatGPT(Business 이상은 전체 MCP, Pro는 읽기 전용).
같은 카테고리에는: Figma Context MCP, AutoClip, Next AI Draw.io
같은 카테고리에서 다른 제작자가 만든 서버예요. 스타 순으로 정렬했어요.
카드 보는 법:↓ 주간 다운로드i★ GitHub 스타i세 기둥: 리뷰 · 점검 · 사용 정도i업데이트 = 최신 버전을 레지스트리에 공개한 날i
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand
제작자의 저장소에서 쓰인 그대로 가져왔어요. PopNx MCP가 검토하거나 보증한 내용이 아니에요. HTML, 이미지, 스크립트는 제거했어요. 링크를 누르면 이 사이트를 벗어나요.
One MCP connection, one prepaid balance, every major image model — Nano Banana, Gemini today, GPT Image next (visible as "coming soon" in list_models). Pixfaro holds the provider accounts, keys, retries and format differences; your agent just asks for an image.
Works with Claude Desktop, Claude Code, Cursor, Windsurf, and any MCP client.
The remote server is the easiest path: paste one URL, sign in with your Pixfaro account in the browser window that opens. No API key in any file.
Claude (claude.ai / Claude Desktop, any plan): Settings → Connectors → Add custom connector → URL https://mcp.pixfaro.com/mcp → sign in. (Team/Enterprise: an org Owner adds it once under Organization settings → Connectors → Custom → Web.)
Cursor: Add to Cursor → — or Cursor Settings → MCP → Add new MCP server (type URL, address https://mcp.pixfaro.com/mcp); Cursor runs the OAuth flow itself.
ChatGPT (Pro/Plus/Business/Edu): Settings → enable Developer mode (connectors live under Plugins since the July 2026 rename, formerly Connectors → Advanced) → add a custom connector with URL https://mcp.pixfaro.com/mcp, OAuth.
{
"mcpServers": { "pixfaro": { "command": "npx", "args": ["-y", "@pixfaro/mcp"], "env": { "PIXFARO_KEY": "pf_live_…" } } } }
For Claude Code:
claude mcp add pixfaro -e PIXFARO_KEY=pf_live_… -- npx -y @pixfaro/mcp
Clients that speak streamable HTTP can also take the remote form in the same file — no key, OAuth on first use:
{ "mcpServers": { "pixfaro": { "url": "https://mcp.pixfaro.com/mcp" } } }
without OAuth can pass an API key instead: `Authorization: Bearer pf_live_…`.
| Tool | What it does |
|---|---|
generate_image | prompt → hosted image URL (+cost and balance in the reply) |
edit_image | natural-language edit of a previous generation by its img_… id |
list_models | models with price, latency, and what each is best for |
render_template | typeset card (quote/post) from a template — $0.02, ~2 s, sharp type · *remote server; npx parity coming in 0.2* |
list_templates | card templates with slots, style axes and exact prices · *remote server* |
upload_asset | upload a PNG/JPEG (≤5 MB) as a reusable asset (e.g. a card avatar) · *remote server* |
get_balance | current prepaid balance |
Replies carry a hosted URL, never base64 — your agent's context stays small.
Both generation tools accept aspect_ratio (e.g. "16:9", "9:16"). Edits keep the source image's shape when you omit it — pass one only to reshape.
The same package family ships an unscoped CLI for scripts, CI, and pipelines:
export PIXFARO_KEY=pf_live_…
npx pixfaro gen "a lighthouse at night, minimal flat style" -a 16:9 -o cover.png npx pixfaro models npx pixfaro balance npx pixfaro edit img_8f2a… "make the sky darker" -o v2.png
| Variable | Meaning |
|---|---|
PIXFARO_KEY | your API key (pf_live_…) — required for everything except models |
PIXFARO_API_URL | endpoint override (default https://api.pixfaro.com) |
The thin open client over the Pixfaro API: the MCP server (@pixfaro/mcp) and the pixfaro CLI share one HTTP client. The balance/provider layer lives behind api.pixfaro.com — this code is intentionally small enough to read before you hand it a key.
MIT © Pixfaro