Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
作者による説明(英語の原文)
MCP server for the Unsplash API: search & fetch photos with attribution + download tracking.
この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。
このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。
使っているAIアプリを選んで、設定をコピーしてください。
UNSPLASH_ACCESS_KEY, UNSPLASH_APP_NAME, LOG_LEVEL「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。
必要なもの
どのアプリを使っていますか?
上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。
Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます
{
"mcpServers": {
"unsplash": {
"command": "npx",
"args": [
"-y",
"@hanoak/unsplash-mcp-server"
],
"env": {
"UNSPLASH_ACCESS_KEY": "your-value",
"UNSPLASH_APP_NAME": "your-value",
"LOG_LEVEL": "your-value"
}
}
}
}ターミナルでこれを実行します
claude mcp add unsplash --env UNSPLASH_ACCESS_KEY=your-value --env UNSPLASH_APP_NAME=your-value --env LOG_LEVEL=your-value -- npx -y @hanoak/unsplash-mcp-server動かす前に、空欄の値を入力してください。
プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます
{
"mcpServers": {
"unsplash": {
"command": "npx",
"args": [
"-y",
"@hanoak/unsplash-mcp-server"
],
"env": {
"UNSPLASH_ACCESS_KEY": "your-value",
"UNSPLASH_APP_NAME": "your-value",
"LOG_LEVEL": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
プロジェクトの .vscode/mcp.json に貼り付けます
{
"servers": {
"unsplash": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@hanoak/unsplash-mcp-server"
],
"env": {
"UNSPLASH_ACCESS_KEY": "your-value",
"UNSPLASH_APP_NAME": "your-value",
"LOG_LEVEL": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
これはパソコンで動くサーバーですが、ChatGPTがつなげるのはインターネット上のサーバーだけです。ほかのアプリを選んでください。
選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。
UNSPLASH_APP_NAME envLOG_LEVEL envこの設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。
パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。
誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月8日にチェック
レジストリ名は、リポジトリを所有するGitHubアカウント hanoak で確認済みです
このリポジトリはまだGitHubから読み取っていません
このリポジトリはまだGitHubから読み取っていません
これはパソコンで動くため、インターネット上のエンドポイントはありません
パソコンで動き、代わりにローカルの設定を使います
パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです
レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。
当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。
入力が必要なもの:UNSPLASH_ACCESS_KEY
あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません(サーバー自体がオンラインサービスを呼び出す場合を除きます)。
GitHubリポジトリの最終更新は–、最新バージョン(1.0.1)がレジストリに届いたのは3 か月前です。
Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。パソコンにNode.jsも必要です。
同じカテゴリには:Figma Context MCP, Claude Real Video, Figma MCP Server
同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。
カードの見方:★ GitHubスターi3つの柱:レビュー · チェック · 利用状況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 production-ready Model Context Protocol (MCP) server for the Unsplash API. It gives AI assistants — Claude Desktop, Claude Code, Cursor, VS Code, Windsurf, and any MCP client — tools to search and fetch Unsplash photos, collections, topics, users, and stats, with Unsplash-guideline compliance built in (ready-to-use attribution and download tracking). Sign in once via OAuth to also manage your own profile, collections, and photo metadata.
[!IMPORTANT]
Unofficial project. This is not affiliated with, endorsed by, or sponsored by Unsplash. "Unsplash" is a trademark of its respective owner. You use it under your own Unsplash API account and are responsible for complying with the Unsplash API Terms & Guidelines.
me tools once you sign in.unsplash_track_download tool for the download-tracking guideline.content_filter=high by default on search and random photos.raw/full/regular/small/thumb sizes, plus a raw imgix base for custom sizes (?w=&h=&q=&fm=&fit=).isError results the model can recover from, plus retries/backoff, timeouts, 403 hourly-limit handling, and rate-limit surfacing.npx, no telemetry.Register an application at [unsplash.com/developers](https://unsplash.com/developers) → New Application → accept the API terms → copy its Access Key (not the Secret Key). New apps start on the Demo tier (50 requests/hour); the Production tier (5,000/hour) requires Unsplash's review from your app dashboard. See Rate limits.
Claude Desktop — edit claude_desktop_config.json:
~/Library/Application Support/Claude/claude_desktop_config.json%APPDATA%\Claude\claude_desktop_config.json{
"mcpServers": { "unsplash": { "command": "npx", "args": ["-y", "@hanoak/unsplash-mcp-server"], "env": { "UNSPLASH_ACCESS_KEY": "your_access_key", "UNSPLASH_APP_NAME": "your_registered_app_name" } } } }
Restart the client. See Configuration for every supported variable.
Other clients (Claude Code, Cursor, VS Code, Windsurf, generic stdio)
Claude Code (CLI):
claude mcp add unsplash \
--env UNSPLASH_ACCESS_KEY=your_access_key \ --env UNSPLASH_APP_NAME=your_registered_app_name \ -- npx -y @hanoak/unsplash-mcp-server
Cursor — ~/.cursor/mcp.json (global) or .cursor/mcp.json (per-project): use the exact same mcpServers block as Claude Desktop above.
Windsurf — ~/.codeium/windsurf/mcp_config.json: same mcpServers block as Claude Desktop above.
VS Code — .vscode/mcp.json (note the top-level key is servers, not mcpServers):
{
"servers": { "unsplash": { "command": "npx", "args": ["-y", "@hanoak/unsplash-mcp-server"], "env": { "UNSPLASH_ACCESS_KEY": "your_access_key", "UNSPLASH_APP_NAME": "your_registered_app_name" } } } }
Any other MCP client — run the server over stdio with:
UNSPLASH_ACCESS_KEY=your_access_key npx -y @hanoak/unsplash-mcp-server
Point your client's stdio transport at command: npx, args: ["-y", "@hanoak/unsplash-mcp-server"], and pass the key via env.
Restart your client and ask:
_"Find me a photo of mountains on Unsplash and show the attribution."_
A typical flow: the model calls unsplash_search_photos, picks a result, presents the image with its attribution, and calls unsplash_track_download when it actually uses the photo.
You: Find a landscape photo of a foggy pine forest and credit the photographer.
Assistant: _(calls
unsplash_search_photoswithquery: "foggy pine forest",orientation: "landscape", picks the best result, then callsunsplash_track_downloadwith itsdownload_location)_
Here's a great match — _Photo by Jane Doe on Unsplash_ — along with a ready-to-embed credit line and the image URL.
Each tool returns a compact JSON payload. Here's the shape of a single photo result (illustrative values):
Example tool output
{
"photo": { "id": "Dwu85P9SOIk", "description": "brown rocky mountain under blue sky during daytime", "width": 6000, "height": 4000, "color": "#734940", "blur_hash": "L6Pj0^i_.AyE_3t7t7R**0o#DgR4", "urls": { "raw": "https://images.unsplash.com/photo-1465…?ixid=…", "full": "https://images.unsplash.com/photo-1465…?ixid=…&q=85", "regular": "https://images.unsplash.com/photo-1465…?ixid=…&w=1080", "small": "https://images.unsplash.com/photo-1465…?ixid=…&w=400", "thumb": "https://images.unsplash.com/photo-1465…?ixid=…&w=200" }, "photo_page": "https://unsplash.com/photos/Dwu85P9SOIk", "download_location": "https://api.unsplash.com/photos/Dwu85P9SOIk/download?ixid=…", "photographer": { "name": "Jane Doe", "username": "janedoe", "profile": "https://unsplash.com/@janedoe" }, "attribution": { "text": "Photo by Jane Doe on Unsplash", "html": "Photo by Jane Doe on Unsplash ", "photographerName": "Jane Doe", "photographerUrl": "https://unsplash.com/@janedoe?utm_source=your_app&utm_medium=referral", "unsplashUrl": "https://unsplash.com/?utm_source=your_app&utm_medium=referral" } }, "rate_limit": { "limit": 50, "remaining": 49 } }
Every tool result includes a rate_limit object (limit, remaining) read from the Unsplash response headers. List/search tools wrap results in photos/collections/users/topics arrays with pagination fields (total, total_pages, count, page, per_page).
Configuration is entirely via environment variables — no config files, no flags for secrets.
| Environment variable | Required | Description | |||
|---|---|---|---|---|---|
UNSPLASH_ACCESS_KEY | yes | Your Unsplash API access key. The server exits at startup with a clear message if it is missing or blank. | |||
UNSPLASH_APP_NAME | recommended | Your registered Unsplash app name, used as the attribution utm_source. Defaults to a generic value (with a startup warning) if unset. | |||
UNSPLASH_SECRET_KEY | only for login | Your Unsplash app's secret key. Only needed to run login — see OAuth sign-in. | |||
UNSPLASH_OAUTH_REDIRECT_URI | only for login | Override the default http://localhost:8734/callback used by login. Must match the redirect URI registered on your Unsplash app. | |||
LOG_LEVEL | no | debug \ | info \ | warn \ | error (default info). All logs go to stderr; stdout carries only the MCP protocol. |
CLI flags: --version and --help are supported (e.g. npx @hanoak/unsplash-mcp-server --version). login/logout are subcommands, not flags — see below.
The 21 core tools work out of the box with just UNSPLASH_ACCESS_KEY. To also use the 8 write/`me` tools (update your profile, manage collections, edit photo metadata), sign in once via OAuth:
http://localhost:8734/callback as a redirect URI, and copy the Secret key.UNSPLASH_ACCESS_KEY and UNSPLASH_SECRET_KEY in your shell (not just the MCP client config — login runs from your terminal). npx @hanoak/unsplash-mcp-server login
This opens your browser to Unsplash's consent screen, captures the redirect on a short-lived local server, exchanges the code for a user access token, and saves it to ~/.config/unsplash-mcp-server/credentials.json (owner-only file permissions). Unsplash user access tokens don't expire, so this is a one-time step — no periodic re-auth.
me tools are now available; the 21 read-only tools are unaffected either way.Run npx @hanoak/unsplash-mcp-server logout at any time to remove the stored token. To revoke it server-side, regenerate your app's secret key from the Unsplash dashboard.
All tools are namespaced unsplash_*. Most are read-only (annotated readOnlyHint: true); the exceptions are unsplash_track_download (registers a download event) and the 8 write/me tools below, all marked non-read-only and gated behind OAuth sign-in. Parameters map to the Unsplash API; per_page and stats quantity are clamped to a max of 30, and page is 1-based.
| Domain | Tools
冒頭だけを表示しています。続きはリポジトリで読めます