ShaderToy-MCP

シェーダートイ-MCP

GLSLシェーダーを作成、実行、共有するためのウェブサイトShaderToy( https://www.shadertoy.com/ )用のMCPサーバー。ClaudeなどのLLMとShaderToyをModel Context Protocol(MCP)を介して接続することで、LLMがWebページ全体をクエリして読み取ることができるようになり、通常は不可能な複雑なシェーダーの作成が可能になります。

生成される複雑なシェーダーの例:


( https://www.shadertoy.com/view/tXs3Wf )


( https://www.shadertoy.com/view/W3l3Df )


マトリックス デジタルレイン( https://www.shadertoy.com/view/33l3Df )

特徴

  • ShaderToy上の任意のシェーダーの情報を取得する
  • 検索プロンプトからShaderToyで利用可能なシェーダーを検索する
  • ShaderToyの既存のシェーダーから学習して複雑なシェーダーを生成する

MCPツール

  • get_shader_info()
  • search_shader()

インストール

Macの場合は、uvを次のようにインストールしてください。

brew install uv

Windowsの場合

powershell -c "irm https://astral.sh/uv/install.ps1 | iex"

その後

set Path=C:\Users\nntra\.local\bin;%Path%

それ以外の場合、インストール手順はウェブサイトに掲載されています: Install uv

クロードデスクトップ統合

git clone https://github.com/wilsonchenghy/ShaderToy-MCP.gitを使用してプロジェクトを Git クローンします。

Claude > 設定 > 開発者 > 構成の編集 > claude_desktop_config.json に移動して、以下を追加します。

{ "mcpServers": { "ShaderToy_MCP": { "command": "uv", "args": [ "run", "--with", "mcp[cli]", "mcp", "run", "<path_to_project>/ShaderToy-MCP/src/ShaderToy-MCP/server.py" ], "env": { "SHADERTOY_APP_KEY": "your_actual_api_key" // Replace with your API key } } } }

Claude で設定ファイルを設定すると、MCP のハンマーアイコンが表示されます。サンプルコマンドを使用して、MCP ツールが正しく使用されているかどうかを確認してください。

コマンド例

Generate shader code of a {object}, if it is based on someone's work on ShaderToy, credit it, make the code follow the ShaderToy format: void mainImage( out vec4 fragColor, in vec2 fragCoord ) {}

-
security - not tested
F
license - not found
-
quality - not tested

GLSLシェーダーを共有するサイト「ShaderToy」のMCPサーバー。このMCPサーバーにより、LLMは通常では作成できない複雑なシェーダーを作成できます。

  1. Features
    1. MCP Tools
      1. Installation
        1. Claude Desktop Integration
          1. Example Commands
            ID: de9upzdhqy