Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
作者による説明(英語の原文)
Angular UI expert for NeuralNg discovery, composition, validation, icons and project-aware themes.
この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。
このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。
使っているAIアプリを選んで、設定をコピーしてください。
必要なもの
どのアプリを使っていますか?
上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。
Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます
{
"mcpServers": {
"neuralng": {
"command": "npx",
"args": [
"-y",
"@neural-ng/mcp-server"
]
}
}
}ターミナルでこれを実行します
claude mcp add neuralng -- npx -y @neural-ng/mcp-serverプロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます
{
"mcpServers": {
"neuralng": {
"command": "npx",
"args": [
"-y",
"@neural-ng/mcp-server"
]
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
プロジェクトの .vscode/mcp.json に貼り付けます
{
"servers": {
"neuralng": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@neural-ng/mcp-server"
]
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
これはパソコンで動くサーバーですが、ChatGPTがつなげるのはインターネット上のサーバーだけです。ほかのアプリを選んでください。
選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。
この設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。
パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。
誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月7日にチェック
レジストリ名は、リポジトリを所有するGitHubアカウント hasanaydin7 で確認済みです
このリポジトリはまだGitHubから読み取っていません
このリポジトリはまだGitHubから読み取っていません
これはパソコンで動くため、インターネット上のエンドポイントはありません
パソコンで動き、代わりにローカルの設定を使います
パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです
レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。
当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。
レジストリには必須のキーは載っていません。ただし、最初に使うときにサインインを求めるサーバーもあります。
あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません(サーバー自体がオンラインサービスを呼び出す場合を除きます)。
GitHubリポジトリの最終更新は–、最新バージョン(1.0.1)がレジストリに届いたのは6 日前です。
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、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。
Read-only Angular UI expert interface for NeuralNg component discovery, contract-backed composition, usage validation, project-consistent guidance and compact theme workflows.
The server is separate from @neural-ng/core. Angular applications never load an MCP runtime in the browser. Theme tools return recipes, validation results, diffs and compile summaries; they do not write files or execute shell commands.
Since rc.4, the catalog covers Editor, theme tools accept native objects, empty queries support bounded browsing and project inspection reports CSS risk hints.
Current release: 1.0.1 (stable MCP interface). Requires Node.js 24.x. Pin the version for reproducible agent environments; @latest selects the latest published release.
npx -y @neural-ng/mcp-server@1.0.1
Generic MCP client configuration:
{
"command": "npx", "args": ["-y", "@neural-ng/mcp-server@1.0.1"] }
The process uses stdio. Standard output is reserved for MCP JSON-RPC messages; fatal diagnostics are written to standard error.
Since 1.0.0-rc.3, tools expose output contracts, the validator accepts native arrays and project inspection separates scan coverage from semantic confidence.
All 20 tools advertise an outputSchema in tools/list. The server validates successful structuredContent before returning it. Invalid output becomes a tool error rather than a success. Tool-handler errors keep isError: true and the separate {error: {schemaVersion: 1, message}} contract; they are not successful instances of the advertised result schema.
Existing result envelopes and schema versions are retained. New fields are additive; consumers must tolerate unknown fields. Required-field removals or type changes require an explicit result-schema version change. Snapshot tests lock the published JSON schema shapes, alongside actual-output and negative tests.
Agent capability discovery:
neural://server/capabilities — versioned tool groups, result schemas, inspection limits, safety guarantees and compatibility guidanceComponent and package resources:
neural://catalogneural://package/exportsneural://components/{id}/contractneural://components/{id}/readmeneural://components/{id}/llmsIcon resources:
neural://icons/catalog — compact package totals, categories, versions and brand-search policy; use search_icons for bounded matchesTheme resources:
neural://themes/catalogneural://themes/schemaneural://themes/presetsneural://themes/presets/neutralneural://themes/presets/glassneural://themes/presets/mistneural://themes/presets/futuristicneural://themes/ai-guideComponent resources are registered as fixed URIs. The server does not accept a filesystem path and does not read arbitrary files.
search_componentsOmit query, or pass an empty/whitespace string, to browse at most limit contracts in stable id order (default 10, maximum 20). Non-empty queries rank matches. Browsing is a bounded preview, not an exhaustive paginated listing.
Searches public selectors, entry points, summaries, README files and llms.txt guidance.
{
"query": "date calendar localized", "limit": 5 }
get_componentReturns the schema-versioned Angular API contract used by coding agents. The standard detail level includes Signal inputs, models and outputs, typed template contexts, required providers, class contract names and the available example count without sending full documentation through the context window.
{
"component": "neural-select", "detail": "standard" }
Use detail: "summary" during discovery and detail: "full" only when every class slot and embedded example is required. Results are returned as both MCP text content and structuredContent.
get_component_examplesReturns a bounded list of published examples with their documentation heading, language and code.
{
"component": "neural-table", "limit": 3 }
get_component_contractLegacy full-contract lookup retained for existing clients. New integrations should use get_component so they can select a token-efficient detail level.
{
"component": "neural-tri-state-checkbox" }
recommend_componentsUses deterministic intent matching. It does not invoke another model or a network service.
{
"goal": "nullable inherited permission checkbox", "limit": 3 }
search_iconsSearches all 6,184 outline and filled Neural Icons variants by exact name, category, or common UI intent. Results are bounded and include the exact nt class, the smallest valid CSS import, ready-to-use markup, supported effects, and accessibility guidance. Brand icons are excluded by default.
{
"query": "delete user", "style": "outline", "limit": 10, "include_brands": false }
Use style: "filled" only when the returned icon lists filled support. Pass a category to narrow the deterministic search. Set include_brands: true only when the product explicitly needs a trademarked brand glyph.
plan_uiTurns a product requirement into a contract-backed NeuralNg composition. The result contains selected primitives and reasons, exact standalone imports, provider requirements, structural regions, state ownership, accessibility checks, implementation order, and component ids that can be passed directly to get_component_examples.
{
"goal": "Admin user management with search, role filter, table and detail drawer", "kind": "auto" }
kind accepts auto, form, page, or table. Auto detection is deterministic; it does not call another model or network service.
Use suggest_form_structure, suggest_page_structure, or suggest_table_structure when the outer interaction shape is already known. Each accepts a non-empty goal and returns the same versioned plan contract as plan_ui with the corresponding kind fixed.
validate_usageParses an Angular template with @angular/compiler and checks the resulting AST against the generated NeuralNg public contracts. It understands Angular control flow, structural directives, interpolation, property/event/two-way bindings, custom elements, and NeuralNg attribute selectors on native elements. It reports stable diagnostic codes with source positions for Angular syntax errors, unknown selectors or bindings, missing required inputs, invalid literal unions (including exported type aliases), inaccessible icon-only buttons, missing standalone imports, required providers, and duplicate Toast channels.
Explicit ng-template directives (such as neuralTableCell) and their nested components are checked too. Event listeners do not satisfy required inputs; model outputs use their generated Change suffix. String-literal property bindings are checked against input unions, and empty static or string-literal accessible labels do not satisfy the icon-only button check.
This is a template contract checker, not a full Angular application compiler. Dynamic expression types, runtime label values, template context types, and application behavior still require Angular compilation and application tests.
{
"template": " ", "imports": ["NeuralButton"], "providers": [] }
Use native arrays of non-empty declaration/provider names. Legacy imports_json and providers_json JSON strings remain supported; do not pass an import map. If both forms are sent, their trimmed, deduplicated name sets must agree; conflicting or malformed values return an explicit tool error. Omitted fields retain the previous empty-array defaults.
The schema-v2 result includes valid, parser identity and version, syntax status, diagnostics, exact suggested imports grouped by entry point, and provider requirements. NNG000 identifies Angular parse failures before contract validation. Informational missing-import diagnostics do not make a template invalid; error diagnostics do.
The generated catalog covers Core and the independently versioned @neural-ng/editor, including Editor template directives, inputs, outputs and typed classes. Contracts expose packageName and packageVersion; neural://package/exports retains the Core fields and adds companionPackages. installedEditorVersion reports locally resolved Editor metadata. NNP010 warns when Editor and its catalog version differ; matching Core alone does not verify Editor APIs. Unrecognized selectors still produce diagnostics.
CSS checks emit warnings, not runtime verdicts: NNP011 detects a flat CSS display rule matching a statically identifiable element using hidden; NNP012 flags root NeuralNg token declarations with !important. A later protective rule may make an NNP011 warning harmless. The check does not compute the cascade, resolve imports or evaluate Sass, inline component styles, dynamic selectors or theme interactions. :where(:root, ...) alone is not a bug. Verify Appearance switching and hidden overlays in a real browser. The hint pass is capped at 1000 hidden elements, 2000 rules and 100 warnings; NNP013 reports those limits. This cap is independent of file scan coverage.
inspect_projectInspects the Angular workspace used as the MCP process working directory and returns declared Angular/NeuralNg package versions, workspace kind, summary counts, used selectors and occurrence locations, icon classes and stylesheets, imports grouped by entry point, configured providers, theme and Appearance setup, inferred conventions, and actionable diagnostics. External templates, inline component templates and attribute directives are parsed with @angular/compiler; invented APIs and accessibility failures therefore use the same diagnostics as validate_usage.
The scan is read-only and accepts no filesystem path. It skips dependencies, build output, VCS data, tests, declarations, and symlinks. Work is bounded to 400 source files, 256 KiB per file, 5 MiB in total, and 10,000 directory entries; oversized files are rejected before their contents are read. The result explicitly reports truncation and analysis confidence. analysis.scanCoverage reports only whether bounded enumeration completed. analysis.semanticConfidence is heuristic or insufficient, never a claim of compiler-level correctness. Templates use Angular AST parsing, while import/provider/theme metadata uses static heuristics. compilationVerified is always false. The legacy confidence field is retained as a deprecated alias for scan completeness, not semantic certainty. Absolute paths are not returned, and component/icon evidence is capped at 25 relative paths per item while filesOmitted preserves the omitted count. angularVersion and neuralPackages contain declarations from the workspace package.json. Optional installedCoreVersion and installedAngularVersion separately report exact versions read from the corresponding local node_modules package manifests. Only bounded metadata within the workspace is read, not dependency source code. Core compatibility prefers installed metadata when available; dependency ranges without that evidence require review. Independently released Core, Icons, Theme, and MCP packages are not required to share a version. Diagnostics validate selectors and APIs present in the generated MCP catalog; an unknown selector from a separate package remains visible instead of being silently treated as valid.
inspect_neuralng_project remains as a compatibility alias and returns the same schema-v2 result. New agents should call inspect_project.
suggest_consistent_uiCombines inspect_project with the composition engine. It identifies which planned primitives a
冒頭だけを表示しています。続きはリポジトリで読めます