This server enables AI agents to interact with Penpot design files through MCP, providing brand context, design tokens, components, layout constraints, and CRUD operations on elements, plus Figma import. Specifically, you can:
Discover accessible Penpot files (list_files).
Extract compressed brand context (get_design_context), design tokens (get_tokens), components (get_components), layout constraints (get_constraints), and page layout (get_page_layout).
Create, update, and delete design elements (create_element, update_element, delete_element).
Import Figma designs with a dry-run option (import_figma).
Verify connectivity and authentication (check_connection).
Provides tools for interacting with Penpot's design files and brand context, allowing AI agents to read and write Penpot designs while maintaining brand context.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type @ followed by the MCP server name and your instructions, e.g., "@teguma get design context for the main dashboard file"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
AI-native design bridge — Penpot MCP + brand context engine.
Figma/Claude Design의 페인포인트를 오픈소스로 해결합니다. AI 에이전트가 브랜드 컨텍스트를 유지하면서 Penpot 디자인을 읽고 쓸 수 있게 하는 MCP 서버입니다.
Figma + Claude Design | Penpot 내장 MCP | teguma | |
브라우저 필요 | ✅ | ✅ (플러그인) | ❌ |
디자인 시스템 임포트 | ❌ 토큰 파괴 | ⚠️ 수동 프롬프트 | ✅ 자동 압축 |
토큰 효율 | ❌ 전체 HTML | ⚠️ 중간 | ✅ 압축 표현 |
오픈소스 | ❌ | ✅ | ✅ |
셀프호스트 | ❌ | ✅ | ✅ |
Related MCP server: ds-pilot
npm install -g teguma
# 또는
npx teguma환경변수:
export PENPOT_URL=https://your-penpot-instance.com
export PENPOT_TOKEN=your-mcp-keyPenpot에서 MCP 키 발급: 계정 → Integrations → MCP Server → 키 생성
.claude/settings.json 또는 MCP 설정에 추가:
{
"mcpServers": {
"teguma": {
"command": "npx",
"args": ["teguma"],
"env": {
"PENPOT_URL": "https://your-penpot.com",
"PENPOT_TOKEN": "your-key"
}
}
}
}도구 | 설명 |
| 파일 전체 브랜드 컨텍스트 추출 (압축) |
| 디자인 토큰 (색상/타이포/간격) |
| 컴포넌트 목록 + 변형 |
| 접근 가능한 파일 목록 |
AI Agent (Claude Code / Cursor / Codex)
│ MCP Protocol (stdio)
▼
┌─── teguma MCP Server ───┐
│ Brand Context Engine │
│ Design Token Compressor │
│ Layout Constraints │
└──────────┬───────────────┘
│ HTTP RPC API
▼
Penpot (self-hosted)npm install
npm run dev # 개발 모드 (tsx)
npm run build # TypeScript 컴파일
npm test # VitestAGENTS.md — 이슈 기반 개발, semver 릴리스, 리뷰 파이프라인.
회사 홍보 썸네일 테스트베드 — SEVASA, 슈퍼쇼츠, 주식회사 로드맵 1080×1080 시안과 재현 가능한 SVG 렌더러
회사 홍보 에디토리얼 v2 — 자연광·현장 맥락·중립 타이포로 AI 특유의 시각 단서를 줄인 시안과 v1/v2 비교
네이버 실노출 썸네일 v3 — 104×104px 검색 결과와 홈피드 크롭에 맞춘 한 피사체·한 문구 대표 이미지
생성형 회사 홍보 배경 원본 — 원본 PNG, 프롬프트, SHA-256, 파생 자산 관계
회사 홍보 v2 배경 원본 — 다큐멘터리형 원본 PNG와 AI provenance
회사 홍보 v3 배경 원본 — 네이버 대표 이미지용 클로즈업 원본과 AI provenance
MIT
경로 | 용도 |
| 리서치 결과물 |
| 기획·명세 |
| 버전별 업데이트 리포트 |
| 수집 데이터 (JSON/YAML) |
| 자동화 스크립트 |
| 출처와 생성 이력이 검증되는 재사용 자산 |
TBD
Unclaimed servers have limited discoverability.
If you are the server author, to access and configure the admin panel.
MCP server for AI agents to plan, verify, and deploy Cloudflare-native apps.
User-owned memory for AI agents, Copilot, Claude, IDEs, CLIs, and chat apps over remote MCP.
Generate on-brand images from your AI agent: design, edit, and render templates over MCP.
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/Doyajin174/teguma'
If you have feedback or need assistance with the MCP directory API, please join our Discord server