Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Descripción del creador (original en inglés)
Platform image sizes with safe zones (free), plus AI extend, upscale and background removal.
Estos tres nunca se combinan en una sola puntuación: las opiniones, las mediciones y la popularidad son cosas distintas.
Todavía no escribimos un resumen sencillo para este. Abajo están los datos que leímos del registro.
Elige la app de IA que usas y copia la configuración.
AuthorizationLos valores marcados como secretos son llaves de tu cuenta. Nunca los compartas ni los pegues en un chat.
Necesitas
¿Qué app usas?
Elige tu app arriba. La recordamos, así que la próxima vez el botón dirá “Instalar en …”.
Esta dirección necesita una clave en un header de la solicitud, y el menú para agregar conectores no puede ponerla. Usa Claude Code, Cursor o VS Code.
Ejecuta esto en tu terminal
claude mcp add --transport http cropden https://cropden.com/mcp --header 'Authorization: your-value'Completa los valores vacíos antes de ejecutarlo.
Pégalo en .cursor/mcp.json de tu proyecto, o en ~/.cursor/mcp.json
{
"mcpServers": {
"cropden": {
"url": "https://cropden.com/mcp",
"headers": {
"Authorization": "your-value"
}
}
}
}Tu navegador te pide permiso para abrir la app; luego la app muestra la configuración y te pide confirmar. Los valores de las claves quedan vacíos para que los completes tú.
Pégalo en .vscode/mcp.json de tu proyecto
{
"servers": {
"cropden": {
"type": "http",
"url": "https://cropden.com/mcp",
"headers": {
"Authorization": "your-value"
}
}
}
}Tu navegador te pide permiso para abrir la app; luego la app muestra la configuración y te pide confirmar. Los valores de las claves quedan vacíos para que los completes tú.
Esta dirección necesita una clave en un header de la solicitud, y el menú para agregar conectores no puede ponerla. Usa Claude Code, Cursor o VS Code.
Tu elección se guarda en una cookie en este dispositivo; no necesitas cuenta.
Authorization secreto HTTP headerEsta configuración se genera a partir de la ficha del creador en el registro. Si el README dice otra cosa, sigue el README.
Nombres y descripciones de las herramientas tal como los informó el servidor el 6 nov 2026. Los escribió el creador, no nosotros; los mostramos como texto sin formato.
get_image_sizesExact image sizes for Instagram, YouTube, TikTok, X, LinkedIn, Facebook, Discord, Twitch, Pinterest, marketplaces and passport photos, with safe zones (pixel areas the app covers or crops), upload limits and minimum sizes. Free, no API key. With no arguments it lists every size i
ai_extend_imageExtend an image to a wider or taller shape with AI, e.g. a portrait photo to a 16:9 YouTube thumbnail without cropping the subject. Costs 5 CropDen credits per run, refunded if it fails. Needs a CropDen API key. Input: PNG, JPEG or WebP, up to 10 MB and 2048 px on the longest sid
ai_upscale_imageUpscale an image 2x or 4x with AI. Costs 8 credits for 2x and 12 for 4x, refunded if it fails. Needs a CropDen API key. Input: PNG, JPEG or WebP, up to 10 MB; longest side up to 2048 px for 2x or 1024 px for 4x. Returns a link to the result, valid 7 days.
ai_remove_backgroundRemove the background of an image with AI; the result is a PNG with transparency. Costs 1 credit per run, refunded if it fails. Needs a CropDen API key. Input: PNG, JPEG or WebP, up to 10 MB and 2048 px on the longest side. Returns a link to the result, valid 7 days.
get_ai_taskStatus of an AI run that was still working when its tool returned. Pass the task_id it gave you; wait about 10 seconds between checks.
get_credit_balanceHow many CropDen credits the API key owner has left.
Revisamos información que cualquiera puede ver; no hemos leído el código. Las revisiones que no aplican no se cuentan. · Revisado el 8 nov 2026
El nombre en el registro se verificó con la cuenta de GitHub geektao1024, dueña del repo
Todavía no hemos leído este repo en GitHub
Todavía no hemos leído este repo en GitHub
Respondió en 1104 ms (HTTP 200)
No hace falta iniciar sesión
Leímos 6 descripciones de herramientas y no encontramos instrucciones ocultas para la IA
Comparado con todos los servidores activos de esta categoría en el registro. Las estrellas solo cuentan cuando quien lo publica es dueño del repo.
Superó 3 de 3 revisiones básicas aplicables. No hemos leído el código. Antes de agregar una clave o un token, revisa qué acceso pide el servidor y usa una clave que tenga solo los permisos que necesitas.
Debes completar: Authorization
Se ejecuta en la nube del creador. Te conectas por internet sin instalar nada, pero lo que envías pasa por los servidores del creador.
El repo de GitHub cambió por última vez –, y la última versión (1.0.0) llegó al registro hace 7 días.
Las apps compatibles con MCP, como Claude Desktop, Claude Code, Cursor y VS Code. Se conecta por URL, así que también funcionan las apps que aceptan servidores MCP remotos, como ChatGPT en modo desarrollador.
En la misma categoría: Figma Context MCP, Claude Real Video, Figma MCP Server
Servidores de la misma categoría hechos por otros creadores, ordenados por estrellas.
Cómo leer una tarjeta:↓ Descargas por semanai★ Estrellas de GitHubiTres pilares: reseñas · revisiones · usoiActualizado = fecha en que se publicó la última versión en el registroi
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.
Copiado tal cual del repo del creador. PopNx MCP no lo ha revisado ni lo respalda. Se quitaron HTML, imágenes y scripts. Los enlaces llevan fuera de este sitio.
Image sizes for 14 platforms: 55 sizes with safe zones, upload limits and minimum sizes, plus specs for 6 passport and visa photos. As JSON, an npm package, an agent skill and an MCP server. Data under CC BY 4.0.
Most size lists stop at width × height. When you crop, you also need to know what the app puts on top of your image: the profile picture over a YouTube banner, the caption bar at the bottom of a Story, the 3:4 profile grid that trims a 4:5 Instagram post. This dataset has those areas in pixels.
One size per row. Each group has more sizes in the data.
| Platform | Image | Size (px) | Ratio | Crop on CropDen |
|---|---|---|---|---|
| 3:4 portrait post (+3 more) | 1080 × 1440 | 3:4 | Crop | |
| Story (+2 more) | 1080 × 1920 | 9:16 | Crop | |
| Profile picture (+1 more) | 320 × 320 | 1:1 | Crop | |
| YouTube | Channel banner (+1 more) | 2560 × 1440 | 16:9 | Crop |
| YouTube | Video thumbnail (4K) (+2 more) | 3840 × 2160 | 16:9 | Crop |
| YouTube | Short (9:16) (+1 more) | 1080 × 1920 | 9:16 | Crop |
| Cover photo (+2 more) | 851 × 315 | 2.70:1 | Crop | |
| Feed post (4:5) (+3 more) | 1080 × 1350 | 4:5 | Crop | |
| Discord | Profile banner (+3 more) | 600 × 240 | 5:2 | Crop |
| Discord | Custom emoji (+2 more) | 128 × 128 | 1:1 | Crop |
| Profile background (+3 more) | 1584 × 396 | 4:1 | Crop | |
| X (Twitter) | Header photo (+3 more) | 1500 × 500 | 3:1 | Crop |
| Twitch | Profile banner (+3 more) | 1200 × 480 | 5:2 | Crop |
| TikTok | Video / photo slide (+2 more) | 1080 × 1920 | 9:16 | Crop |
| Standard pin (2:3) (+2 more) | 1000 × 1500 | 2:3 | Crop | |
| Snapchat | Story / Spotlight | 1080 × 1920 | 9:16 | Crop |
| Etsy | Listing photo (4:3) (+2 more) | 3000 × 2250 | 4:3 | Crop |
| Shopify | Product image | 2048 × 2048 | 1:1 | Crop |
| eBay | Listing photo | 1600 × 1600 | 1:1 | Crop |
| Amazon | Main product image | 2000 × 2000 | 1:1 | Crop |
Passport photos (make one on CropDen):
| Document | Pixels | Print size |
|---|---|---|
| US passport & visa | 600 × 600 | 50.8 × 50.8 mm |
| UK passport | 600 × 771 | 35 × 45 mm |
| EU / Schengen | 600 × 771 | 35 × 45 mm |
| Canada | 600 × 840 | 50 × 70 mm |
| Australia | 600 × 771 | 35 × 45 mm |
| China visa | 600 × 873 | 33 × 48 mm |
All sizes and their zones are in data/social-media-image-sizes.json. To crop an image to any of them in your browser, follow the link in the last column.
npm install social-media-image-sizes
import { getSize, groups } from 'social-media-image-sizes';
const post = getSize('instagram-post/portrait-34'); // { width: 1080, height: 1440, ratio: '3:4', exact: true, ... }
const youtube = groups.filter((g) => g.platform === 'YouTube');
CommonJS works too: const { getSize } = require('social-media-image-sizes').
const res = await fetch('https://cropden.com/data/social-media-image-sizes.json');
const { groups, passportPhotos } = await res.json();
The endpoint allows cross-origin requests and is cached for an hour.
skills/social-media-image-sizes is an Agent Skill for Claude Code, Codex, Cursor and other agents that read SKILL.md. Ask "turn this photo into a YouTube banner" or "what size is an Instagram story?". It picks the size, crops the image on your machine with sharp, keeps the file under the upload limit, and draws a preview with the covered areas in red.
npx skills add geektao1024/social-media-image-sizes
Or copy the folder into ~/.claude/skills/ (Claude Code) or your agent's skills folder.
CropDen runs a remote MCP server at https://cropden.com/mcp (Streamable HTTP).
| Tool | What it does | Cost |
|---|---|---|
get_image_sizes | Sizes, safe zones and upload limits from this dataset | Free, no key |
ai_extend_image | Extend an image to a wider or taller shape (outpainting) | 5 credits |
ai_upscale_image | Upscale 2x or 4x | 8 or 12 credits |
ai_remove_background | Transparent PNG | 1 credit |
get_ai_task, get_credit_balance | Check a long run, check your balance | Free, needs a key |
Claude Code:
claude mcp add --transport http cropden https://cropden.com/mcp \
--header "Authorization: Bearer YOUR_CROPDEN_API_KEY"
Other clients: add https://cropden.com/mcp as a Streamable HTTP server with the same header. Get a key at cropden.com under Settings → API keys. The AI tools use the same credits as the website, and a failed run is refunded. Without a key, only get_image_sizes works.
| Field | Meaning |
|---|---|
id | / , e.g. youtube-banner/banner |
width, height | Pixels to export |
ratio | Aspect ratio, e.g. 3:4 |
exact | false means only the ratio matters |
recommended | The size we'd pick when a group has several |
minWidth, minHeight | Smallest upload the platform accepts or needs |
maxBytes | Upload limit in bytes (1 MB = 1,000,000) |
zones | Areas in pixels: safe-area (keep content inside), ui-overlay (covered by the app), crop-preview (what another view shows) |
zones[].measured | Measured in the live app; the platform doesn't publish it |
zones[].x, y, ... | Pixels from the top-left of the image. A zone can reach past the edge, like a profile picture that overlaps the bottom of a banner |
note | One-line tip, in English and Chinese |
Each group also has formats, facts (video length and similar), verified and a url to crop on CropDen. Passport photos add print size in millimetres and head and eye-line ranges as fractions of the photo height.
measured: true were measured in the apps. Apps move their buttons around, so treat those as guides.verified is the month a group was last checked. Source links for every group are coming in 0.2.0.If you only want values the platforms document themselves, use The Social Specification, which marks everything else as not documented. This dataset is made for cropping, so it fills those gaps with practical sizes and safe zones.
CropDen does the cropping. Pick a size, see the safe zones over your own image, and export at the exact pixel size and under the upload limit. The crop and resize tools run in your browser. The site also has batch resizing and AI tools: extend, upscale and remove background.
data/, and the same data in index.js and index.cjs): CC BY 4.0. Credit it like this: Image size data by CropDen (https://cropden.com), CC BY 4.0. On a website, the link is enough.SammaPix (MIT) was our starting reference for which platforms and passport photos to cover, and we cross-checked sizes against its data files.
If this saved you a lookup, a star helps other people find it.
Built in public by Geektao (@geektao0319, posts in Chinese).