Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)
Buy human image preference comparisons on the Pebbler app with locally controlled USDC payments.
สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน
ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry
เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
PEBBLER_ALLOW_PAYMENTS, PEBBLER_WALLET_PRIVATE_KEY, PEBBLER_MAX_PURCHASE_USDC, PEBBLER_MAX_TOTAL_USDC, PEBBLER_STATE_DIRค่าที่ติดป้ายความลับคือกุญแจของบัญชีคุณ อย่าส่งให้ใคร และอย่าวางในแชต
ต้องเตรียมก่อน
คุณใช้แอปไหน
เลือกแอปด้านบน เราจำไว้ให้ ครั้งหน้าปุ่มจะขึ้นว่า “ติดตั้งลง …”
เปิด Claude Desktop → Settings → Developer → Edit Config แล้ววางค่านี้ในไฟล์ claude_desktop_config.json
{
"mcpServers": {
"pebbler": {
"command": "npx",
"args": [
"-y",
"@pebbler/pebbler-mcp"
],
"env": {
"PEBBLER_ALLOW_PAYMENTS": "ใส่ค่าของคุณ",
"PEBBLER_WALLET_PRIVATE_KEY": "ใส่ค่าของคุณ",
"PEBBLER_MAX_PURCHASE_USDC": "ใส่ค่าของคุณ",
"PEBBLER_MAX_TOTAL_USDC": "ใส่ค่าของคุณ",
"PEBBLER_STATE_DIR": "ใส่ค่าของคุณ"
}
}
}
}พิมพ์คำสั่งนี้ใน Terminal
claude mcp add pebbler --env PEBBLER_ALLOW_PAYMENTS='ใส่ค่าของคุณ' --env PEBBLER_WALLET_PRIVATE_KEY='ใส่ค่าของคุณ' --env PEBBLER_MAX_PURCHASE_USDC='ใส่ค่าของคุณ' --env PEBBLER_MAX_TOTAL_USDC='ใส่ค่าของคุณ' --env PEBBLER_STATE_DIR='ใส่ค่าของคุณ' -- npx -y @pebbler/pebbler-mcpเติมค่าที่เว้นว่างไว้ก่อนรัน
วางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json
{
"mcpServers": {
"pebbler": {
"command": "npx",
"args": [
"-y",
"@pebbler/pebbler-mcp"
],
"env": {
"PEBBLER_ALLOW_PAYMENTS": "ใส่ค่าของคุณ",
"PEBBLER_WALLET_PRIVATE_KEY": "ใส่ค่าของคุณ",
"PEBBLER_MAX_PURCHASE_USDC": "ใส่ค่าของคุณ",
"PEBBLER_MAX_TOTAL_USDC": "ใส่ค่าของคุณ",
"PEBBLER_STATE_DIR": "ใส่ค่าของคุณ"
}
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
วางในไฟล์ .vscode/mcp.json ของโปรเจกต์
{
"servers": {
"pebbler": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@pebbler/pebbler-mcp"
],
"env": {
"PEBBLER_ALLOW_PAYMENTS": "ใส่ค่าของคุณ",
"PEBBLER_WALLET_PRIVATE_KEY": "ใส่ค่าของคุณ",
"PEBBLER_MAX_PURCHASE_USDC": "ใส่ค่าของคุณ",
"PEBBLER_MAX_TOTAL_USDC": "ใส่ค่าของคุณ",
"PEBBLER_STATE_DIR": "ใส่ค่าของคุณ"
}
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
ตัวนี้รันในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะ server บนอินเทอร์เน็ต ลองเลือกแอปอื่น
ตัวเลือกเก็บในคุกกี้บนเครื่องนี้ ไม่ต้องมีบัญชี
PEBBLER_ALLOW_PAYMENTS envPEBBLER_MAX_PURCHASE_USDC envPEBBLER_MAX_TOTAL_USDC envPEBBLER_STATE_DIR envค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 7 พ.ย. 2569
ชื่อใน registry ยืนยันด้วยบัญชี GitHub bridge-applications ซึ่งเป็นเจ้าของ repo
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 1 จาก 1 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
ต้องใส่ค่าเหล่านี้: PEBBLER_WALLET_PRIVATE_KEY
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด – และส่งรุ่นล่าสุด (0.1.0) เข้า registry 32 วันที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย
ในหมวดเดียวกันมี Figma Context MCP, Claude Real Video, Figma MCP Server
server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว
อ่านการ์ด:★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi
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.
server ทางการของ Figma ส่งข้อมูลงานออกแบบให้ AI อ่าน เพื่อเปลี่ยนแบบเป็นโค้ดหรืออธิบายแบบได้ตรงขึ้น ต่อผ่านคลาวด์ของ Figma
ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
Let your agent collect human feedback on two images and explain the results. Pebbler runs image preference tests with participants on the Pebbler app.
Your agent retrieves current pricing, package details and availability before creating a test. The purchase uses a live quote and stays within the spending limits you configure. Pricing and package sizes are not fixed by this connector.
Version 1 supports image A/B preference tests. These measure which image people prefer, rather than product conversion or causal effects. Completed response counts are not guaranteed. Surveys and text-only comparisons are not supported.
Use an MCP app that supports local servers and Node.js 22 or later. Add this configuration to your app:
{
"mcpServers": { "pebbler": { "command": "npx", "args": ["-y", "@pebbler/pebbler-mcp@0.1.0"] } } }
Pebbler's production settings are included. You can explore current packages and create drafts without enabling payments.
Use a dedicated wallet funded with native USDC on Base. Configure these settings locally in your MCP app's environment or secret settings:
| Setting | What to provide |
|---|---|
PEBBLER_ALLOW_PAYMENTS | Set to true when you want the agent to make purchases |
PEBBLER_WALLET_PRIVATE_KEY | Your wallet's signing key, supplied privately |
PEBBLER_MAX_PURCHASE_USDC | Your chosen maximum spend per test, as a positive decimal USDC amount |
PEBBLER_MAX_TOTAL_USDC | Your chosen cumulative spending limit, as a positive decimal USDC amount |
Both spending limits are required when payments are enabled. They are your budget, not the price of a test. If a quote exceeds either limit, the connector stops instead of raising your budget. Payments stay disabled until you enable them explicitly.
The wallet key remains local. Do not put it in a prompt or share it in a conversation. Prices and quotes are fetched by the agent; you do not need to configure them.
For example:
Check the current package and price, then compare these two image URLs. Tell me the quote before buying and stay within my configured budget.
Provide two publicly accessible HTTPS image URLs and a clear question. Use images you own or have permission to use, and keep the URLs available while responses are collected.
Your agent can show the current offer, create a draft, purchase the test and check progress. You can read partial results while collection continues or return later to ask for the final counts and vote shares. Retrieving results is included in the purchase.
| Tool | Purpose |
|---|---|
get_catalog | Retrieve current packages, prices, supported inputs and availability |
create_study | Prepare an image comparison and obtain its quote |
quote_study | Refresh a quote before payment has been signed |
purchase_study | Purchase the quoted test within your wallet's spending limits |
get_study_status | Check progress and when to check again |
get_study_results | Retrieve aggregate A/B votes and shares |
list_local_studies | Find your saved tests after returning or restarting |
The agent learns each tool's inputs automatically when connected. It should read the catalog first, use the quote for the purchase, and follow the returned polling interval when checking progress.
Keep the connector's private local state folder backed up. It retains access to your tests and their purchase history across restarts. You can choose a folder with PEBBLER_STATE_DIR; use the same folder when returning to existing tests.
Your total spending limit counts retained signed purchases, including unresolved attempts, and does not reset automatically. Increase it deliberately if you want to buy more tests. Keep the original state rather than deleting it to reset your budget.
If a purchase is interrupted or pending, ask the agent to retry that same purchase. The connector preserves its identifiers and payment authorization instead of signing another payment. Reading progress and results does not require another purchase.
The included examples/run-study.mjs demonstrates discovery and creating an image comparison. It prints the live catalog and quote; purchasing requires the --purchase flag and your locally configured wallet and budgets.
MIT. Original example image assets are included under the same license.