decrease-token-figma
Figma Cost Optimizer Bridge
Figma Desktop 디자인 컨텍스트를 LLM 코딩 에이전트가 구현하기 좋은 토큰 효율적인 다중 웹 프레임워크 handoff로 압축하는 로컬 MCP 브리지입니다.
벤치마크 요약
최신 fixture: DashStack Dashboard, 측정일 2026-06-16 (블라인드 3회, claude-sonnet-4-6).
| 경로 | 총 추정 입력 토큰 | 픽셀 유사도(평균) |
|---|---|---|
| 공식 Figma MCP raw | 13,926 | 83.12% |
| Bridge handoff | 7,232 | 84.76% |
추정 입력 토큰 절감률: 48.07% — 게다가 bridge 쪽이 평균 +1.65 pp 더 정확했습니다.
설치
npm install -g decrease-token-figma
figma-bridge
MCP 클라이언트 설정
{
"mcpServers": {
"figma-cost-optimizer-bridge": {
"command": "npx",
"args": ["-y", "decrease-token-figma"],
"env": {
"FIGMA_BRIDGE_ROOT": "/absolute/path/to/your/app"
}
}
}
}
Codex와 Claude Code 설정
FIGMA_BRIDGE_ROOT가 올바른 파일시스템 위치를 가리키도록, 구현할 앱 프로젝트 루트에서 실행하세요.
codex mcp add figma-cost-optimizer-bridge \
--env FIGMA_BRIDGE_ROOT="$PWD" \
-- npx -y decrease-token-figma
claude mcp add -s local figma-cost-optimizer-bridge \
-e FIGMA_BRIDGE_ROOT="$PWD" \
-- npx -y decrease-token-figma
등록 확인 또는 제거:
codex mcp list
claude mcp list
codex mcp remove figma-cost-optimizer-bridge
claude mcp remove figma-cost-optimizer-bridge
브리지가 시작되면 FIGMA_BRIDGE_ROOT의 AGENTS.md와 CLAUDE.md 맨 위에 가드레일을 추가해, Figma 작업에서 figma-cost-optimizer-bridge만 사용하고 공식 Figma MCP로 폴백하지 않도록 안내합니다. 이 동작을 끄려면 FIGMA_BRIDGE_WRITE_AGENT_RULES=0을 설정하세요.
도구 충돌 방지
공식 figma-mcp 서버를 이 브리지와 함께 등록하지 않는 것을 권장합니다. 아래 명령으로 점검하고 정리하세요.
figma-bridge doctor
figma-bridge migrate-config --yes
브리지는 get_design_context, get_figma_context, get_screenshot 같은 compatibility alias도 제공하므로 일반 workflow에서 공식 Figma MCP 서버를 대체할 수 있습니다.
왜 로컬에서 실행하나요?
이 브리지는 호스팅 웹 서비스가 아닙니다. 다음에 접근해야 합니다.
- Figma Desktop local MCP:
127.0.0.1:3845 - 캐시와 에셋을 저장할 사용자의 프로젝트 파일시스템
- 자동 준비되며 handoff 생성에 필요한 로컬 Ollama 분석
실제 설치와 실행은 npm 또는 GitHub를 사용하세요. GitHub Pages는 문서와 벤치마크 리포트 공개용입니다.