Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
제작자가 쓴 설명(영어 원문)
Zero-auth MCP: image optimize, cited storage/format data, and dev utilities LLMs get wrong.
이 세 가지는 절대 하나의 점수로 합치지 않아요. 의견, 측정, 인기는 서로 다른 것이니까요.
이 서버는 아직 쉬운 말로 된 요약을 쓰지 못했어요. 아래는 레지스트리에서 읽어 온 사실이에요.
쓰고 있는 AI 앱을 고른 다음 설정을 복사하세요.
필요한 것
어떤 앱을 쓰세요?
위에서 앱을 고르세요. 기억해 두었다가 다음부터는 버튼에 “…에 설치”라고 표시해요.
웹, 데스크톱, 모바일의 Claude에서 쓸 수 있어요:
https://mcp.cleanor.app/mcpClaude Desktop → Settings → Developer → Edit Config를 열고 claude_desktop_config.json에 이 내용을 붙여 넣으세요
{
"mcpServers": {
"cleanor": {
"command": "npx",
"args": [
"-y",
"@cleanor/mcp"
]
}
}
}터미널에서 이 명령어를 실행하세요
claude mcp add --transport http cleanor https://mcp.cleanor.app/mcpclaude mcp add cleanor -- npx -y @cleanor/mcp프로젝트의 .cursor/mcp.json 또는 ~/.cursor/mcp.json에 붙여 넣으세요
{
"mcpServers": {
"cleanor": {
"url": "https://mcp.cleanor.app/mcp"
}
}
}프로젝트의 .cursor/mcp.json 또는 ~/.cursor/mcp.json에 붙여 넣으세요
{
"mcpServers": {
"cleanor": {
"command": "npx",
"args": [
"-y",
"@cleanor/mcp"
]
}
}
}브라우저가 앱을 열지 물어본 다음, 앱이 설정을 보여 주고 확인을 요청해요. 키 값은 비워 두니 직접 입력하세요.
프로젝트의 .vscode/mcp.json에 붙여 넣으세요
{
"servers": {
"cleanor": {
"type": "http",
"url": "https://mcp.cleanor.app/mcp"
}
}
}프로젝트의 .vscode/mcp.json에 붙여 넣으세요
{
"servers": {
"cleanor": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@cleanor/mcp"
]
}
}
}브라우저가 앱을 열지 물어본 다음, 앱이 설정을 보여 주고 확인을 요청해요. 키 값은 비워 두니 직접 입력하세요.
ChatGPT는 인터넷에 있는 서버에만 연결할 수 있어요:
https://mcp.cleanor.app/mcp메뉴 이름은 요금제나 시기에 따라 조금 다를 수 있어요.
선택한 앱은 이 기기의 쿠키에만 저장돼요. 계정은 필요 없어요.
이 설정은 제작자의 레지스트리 정보로 만들었어요. README와 다르면 README를 따르세요.
아직 이 서버의 도구 목록을 읽지 않았어요. 엔드포인트는 차례대로 돌아가며 점검해요.
누구나 볼 수 있는 정보를 점검했고, 코드는 읽지 않았어요. 해당하지 않는 항목은 개수에서 뺐어요. · 2026년 11월 6일 점검
레지스트리 이름이 도메인 cleanor.app 기준으로 확인되었어요(레지스트리가 도메인 소유를 확인해요)
아직 GitHub에서 이 저장소를 읽어 오지 않았어요
아직 GitHub에서 이 저장소를 읽어 오지 않았어요
아직 점검하지 않았어요. 엔드포인트는 차례대로 돌아가며 점검해요
아직 점검하지 않았어요. 엔드포인트는 차례대로 돌아가며 점검해요
아직 점검하지 않았어요. 엔드포인트를 점검할 때 도구 목록을 읽어요
레지스트리에서 이 카테고리의 활성 서버 전체와 비교했어요. 스타는 게시자가 저장소를 소유한 경우에만 세요.
해당하는 기본 점검 1개 중 1개를 통과했어요. 코드는 읽지 않았어요. 키나 토큰을 넣기 전에 서버가 어떤 권한을 요구하는지 확인하고, 꼭 필요한 권한만 있는 키를 쓰세요.
레지스트리에 필수 키가 나와 있지 않아요. 다만 처음 쓸 때 로그인을 요구하는 서버도 있어요.
둘 다 가능해요. 내 컴퓨터에 설치해도 되고, 클라우드 버전에 연결해도 돼요.
GitHub 저장소는 마지막으로 – 변경됐고, 최신 버전(0.6.1)은 4개월 전 레지스트리에 올라왔어요.
Claude Desktop, Claude Code, Cursor, VS Code처럼 MCP를 지원하는 앱에서 쓸 수 있어요. URL로 연결되기 때문에, 원격 MCP 서버를 지원하는 앱(예: 개발자 모드의 ChatGPT)에서도 쓸 수 있어요.
같은 카테고리에는: Figma Context MCP, Claude Real Video, Figma MCP Server
같은 카테고리에서 다른 제작자가 만든 서버예요. 스타 순으로 정렬했어요.
카드 보는 법:★ GitHub 스타i세 기둥: 리뷰 · 점검 · 사용 정도i업데이트 = 최신 버전을 레지스트리에 공개한 날i
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Let any LLM watch a video locally — and search everything it has ever watched.
The Figma MCP server brings Figma design context directly into your AI workflow.
제작자의 저장소에서 쓰인 그대로 가져왔어요. PopNx MCP가 검토하거나 보증한 내용이 아니에요. HTML, 이미지, 스크립트는 제거했어요. 링크를 누르면 이 사이트를 벗어나요.
A hosted, zero-auth MCP server with 22 tools: optimize and convert images, generate QR codes, and run the deterministic dev utilities LLMs get wrong.
No API key. No signup. No OAuth. Point any Model Context Protocol client at one URL and 22 tools appear, all read-only and safe to hand to an autonomous agent.
| Streamable HTTP endpoint | https://mcp.cleanor.app/mcp |
| npm package (stdio) | @cleanor/mcp |
| Official MCP Registry | app.cleanor/cleanor |
| Homepage | cleanor.app/mcp |
| Auth | none |
| Tools | 22 |
| Version | 0.6.0 |
Pick your client. Every option below points at the same hosted server, so there is nothing to build, install or key.
claude mcp add --transport http cleanor https://mcp.cleanor.app/mcp
Then run claude mcp list to confirm it connected. Full walkthrough: docs/add-an-mcp-server-to-claude-code.md.
Add to .cursor/mcp.json (per project) or ~/.cursor/mcp.json (global):
{
"mcpServers": { "cleanor": { "url": "https://mcp.cleanor.app/mcp" } } }
Run code --add-mcp '{"name":"cleanor","type":"http","url":"https://mcp.cleanor.app/mcp"}', or add the server to .vscode/mcp.json in the workspace:
{
"servers": { "cleanor": { "type": "http", "url": "https://mcp.cleanor.app/mcp" } } }
Open Settings, then Connectors, then "Add custom connector", and paste the endpoint:
https://mcp.cleanor.app/mcp
Or run the server locally over stdio from claude_desktop_config.json:
{
"mcpServers": { "cleanor": { "command": "npx", "args": ["-y", "@cleanor/mcp"] } } }
The npm build is the same tool registry compiled for Node. It uses sharp (an optional dependency) for local image encoding; the other 21 tools need nothing.
The endpoint speaks the MCP Streamable HTTP transport, so you can drive it with curl or any HTTP client:
curl -s https://mcp.cleanor.app/mcp \
-H 'content-type: application/json' \ -H 'accept: application/json, text/event-stream' \ -d '{"jsonrpc":"2.0","id":1,"method":"initialize", "params":{"protocolVersion":"2025-06-18","capabilities":{}, "clientInfo":{"name":"curl","version":"1"}}}'
There is also a plain REST surface for non-MCP callers: GET /v1/capabilities (feature detection, machine-readable tool list) and POST /v1/optimize (one image in, optimized bytes out).
22 tools, every one of them carrying an input and an output schema, so a client gets typed structuredContent back and not just a wall of text.
| Tool | What it does | Key params | |||
|---|---|---|---|---|---|
optimize_image | Fetches an image from a public URL and re-encodes it smaller. Returns the optimized image plus before and after byte counts. Input capped at 25 MB. | image_url (required), format (webp \ | avif \ | jpeg, default webp), width (16 to 4096 px, optional), quality (1 to 100, default 80) | |
placeholder_image | Dependency-free SVG placeholder at any size, with a label and custom colors. | width (default 600), height (default 400), bg, color, text | |||
qr_code | Encodes text or a URL as a crisp SVG QR code you can paste anywhere. | text (required, up to 2000 chars), ecc (L \ | M \ | Q \ | H, default M), size (64 to 1024, default 320) |
| Tool | What it does | Key params | ||
|---|---|---|---|---|
storage_capacity | How many photos or minutes of video actually fit in a storage tier, corrected for real OS and filesystem overhead. Returns a per-format breakdown. | storage_gb (required, 1 to 4096), content (photos \ | video, default photos) | |
image_format_savings | How much smaller WebP, AVIF or JPEG XL are than JPEG at matched perceptual quality, from a controlled benchmark on the 24-image Kodak suite. Also reports the HEIC conversion tax. | format (webp \ | avif \ | jxl, default avif), quality (web = SSIM 0.95, high = SSIM 0.98, default web) |
The operations an LLM is unreliable at: hashing, counting, radix math, timezones. Pure compute, no network, no state.
| Tool | What it does | Key params | ||||
|---|---|---|---|---|---|---|
hash | SHA-1/256/384/512 hex digest of text. MD5 is deliberately not offered. | input (required), algorithm (default sha-256) | ||||
hmac | Keyed HMAC signature, hex or Base64. For signing and verifying webhooks. | message (required), secret (required), algorithm (default sha-256), encoding (hex \ | base64) | |||
uuid | UUID v4 (random) or v7 (time-sortable, the better database key). | version (v4 \ | v7, default v4), count (1 to 100) | |||
base64 | Base64 encode or decode, UTF-8 safe, optional URL-safe alphabet. | input (required), mode (encode \ | decode), url_safe (boolean) | |||
json_format | Validates JSON, then pretty-prints or minifies it, optionally deep-sorting keys. Returns a precise parse error if invalid. | input (required), mode (pretty \ | minify), sort_keys (boolean) | |||
jwt_decode | Decodes a JWT header and payload and flags expiry. The signature is not verified and no secret is needed. | token (required) | ||||
regex_test | Runs a JavaScript regex against sample text and returns every match with its index and captured groups (first 100). | pattern (required), input (required), flags (default g) | ||||
cron_describe | Explains a 5-field cron expression in plain English and lists the next 5 run times in UTC. | expression (required) | ||||
unit_convert | Exact conversion across length, mass, data size, time, speed and temperature. | value (required), from (required), to (required) | ||||
datetime | The real current time, or any timestamp, rendered in an IANA timezone as ISO, Unix and human forms. | input (optional Unix timestamp or ISO string), timezone (default UTC) | ||||
url_parse | Splits a URL into scheme, host, port, path, decoded query params and fragment. | url (required) | ||||
base_convert | Integer conversion between bases 2 and 36, BigInt-exact so large values stay exact. | value (required), from_base (default 10), to_base (default 16) | ||||
diff | Line-by-line diff of two texts with an added and removed count. Up to 1000 lines per side. | a (required), b (required) | ||||
color | Converts one color into hex, RGB and HSL at once. Accepts hex, rgb(), hsl() and CSS names. | value (required) | ||||
color_palette | Derives a harmonious palette from one base color. | color (required), harmony (complementary \ | analogous \ | triadic \ | tetradic \ | monochromatic) |
slugify | Clean, URL-safe slug from a title: lowercased, hyphenated, accents stripped. | input (required), separator (- \ | _) | |||
count | Exact characters (code points), UTF-16 units, words, lines and UTF-8 bytes. | input (required) |
Every tool is annotated readOnlyHint: true. Only optimize_image touches the network (openWorldHint: true); the other 21 are pure functions of their input.
Full input and output schemas: docs/mcp-tools-reference.md.
data/tools.csv is the same 22 tools as a flat, machine-readable table: name, title, category (image, data, dev), summary, required and optional parameters, and output fields. Handy for diffing releases, feeding an MCP directory, or comparing this server against another.
The file is generated, not hand-written: every value is read out of the tool's Zod schema in src/tools/. If you add or change a tool, regenerate it.
npm run tools:csv # rewrite data/tools.csv from src/tools/
npm run tools:csv:check # exit 1 if data/tools.csv is out of date
| Page | What it answers |
|---|---|
| How to add an MCP server to Claude Code | The claude mcp add command for stdio, HTTP and SSE servers, the three config scopes, and how to debug a server that will not connect. |
| MCP server for image optimization | How to let an AI agent compress and convert images (WebP, AVIF, JPEG) through MCP, and the measured savings per format. |
| MCP tools reference | All 22 tools, one section each, with the complete input and output schema and an example call. |
Yes. It is free to use, with no account, no API key and no paid tier. The hosted endpoint is rate-limited per IP (120 requests per minute in general, 30 per minute for image optimization) so one client cannot starve the rest, and the source is MIT licensed if you would rather run it yourself.
No. Auth is none, which you can verify for yourself at GET https://mcp.cleanor.app/v1/capabilities. There is no signup, no OAuth flow and no token to rotate. Point your client at https://mcp.cleanor.app/mcp and start calling tools.
Only what you pass to a tool. 21 of the 22 tools are pure functions evaluated on the server, and optimize_image additionally fetches the public image URL you hand it. There is no account, no user identifier, and no database or object store in the server: it is a single Cloudflare Worker with no persistence binding for your inputs. If your data is sensitive, run the stdio build locally with npx -y @cleanor/mcp and nothing leaves your machine.
Yes, in two ways. Run it locally over stdio with npx -y @cleanor/mcp (the same tool registry, with sharp doing the image encoding instead of Cloudflare Images), or deploy this repo to your own Cloudflare account with wrangler deploy, since the Worker entry point and wrangler.jsonc are both in the tree. The Dockerfile builds the stdio server for registries and scanners that prefer to start it themselves.
A local (stdio) server is a process your client spawns on your machine: it can reach your filesystem, but you have to install it, keep it updated and carry its dependencies. A hosted (Streamable HTTP) server is just a URL: no install, no version drift, and the heavy work runs on someone else's CPU. Cleanor MCP is offered both ways, and the hosted endpoint is the one to prefer for image optimization, because Cloudflare Images does the encoding and you never install sharp.
Any MCP client that speaks Streamable HTTP: Claude Code, Claude Desktop (as a custom connector), Cursor, VS Code, and the agent frameworks with MCP support. Clients that only speak stdio can run the npm package instead. Both paths expose the identical 22 tools, because both register the same tool array from src/tools/.
storage_capacity and image_format_savings return numbers from Cleanor Labs' publish
앞부분만 보여 드려요. 나머지는 저장소에서 읽어 보세요