11# ShaderBase
22
3- ShaderBase is an agent-first shader registry for Three.js ecosystems. Git-backed manifests and recipes are the canonical product. Search indexes, CLI tools, and MCP servers are derived artifacts .
3+ A shader registry for Three.js — browse, search, and add production-ready GLSL shaders to your project. Like [ shadcn/ui ] ( https://ui.shadcn.com ) , but for shaders: the CLI copies source files into your codebase. You own the code .
44
5- ## Architecture
5+ ** [ shaderbase.com ] ( https://shaderbase.com ) ** · ** [ MCP server ] ( https://mcp.shaderbase.com/mcp ) **
66
7- ```
8- shaders/ Canonical shader corpus (source of truth)
9- packages/
10- schema/ Zod-based manifest validation
11- cli/ CLI: npx @shaderbase/cli search/add (shadcn-style)
12- mcp/ MCP server for AI agent integration (Cloudflare Worker)
13- scripts/
14- build-registry.ts Generates static registry JSON from corpus
15- validate-shaders.ts Validates all shader manifests
16- apps/web/ SolidJS web app (browse, search, detail pages)
17- ```
18-
19- ### How it works
20-
21- 1 . ** Shaders live in git** — each shader has ` shader.json ` , GLSL source, and integration recipes
22- 2 . ** CI builds the registry** — static JSON index + per-shader bundles deployed to CDN
23- 3 . ** Agents use MCP** — ` search_shaders ` and ` get_shader ` tools via remote MCP server
24- 4 . ** Humans use the CLI** — ` npx @shaderbase/cli add gradient-radial --env r3f `
25- 5 . ** Files are copied into your project** (shadcn-style) — you own the code
26-
27- ## Quick Start
28-
29- ``` bash
30- bun install
31- bun run check # test + typecheck + validate + build
32- bun run dev:web # dev server on :3000
33- bun run build:registry # generate dist/registry/
34- ```
35-
36- ## Using ShaderBase
7+ ## Usage
378
389### CLI
3910
@@ -42,18 +13,19 @@ bun run build:registry # generate dist/registry/
4213npx @shaderbase/cli search --query " gradient"
4314npx @shaderbase/cli search --pipeline postprocessing --env r3f
4415
45- # Add a shader to your project
16+ # Add a shader to your project (copies files, you own them)
4617npx @shaderbase/cli add gradient-radial --env r3f
4718npx @shaderbase/cli add gradient-radial --env three --dir src/shaders
4819
49- # Submit a shader (creates a GitHub PR via AI analysis )
20+ # Submit a shader (AI parses your GLSL, creates a GitHub PR)
5021npx @shaderbase/cli submit " void main() { gl_FragColor = vec4(1.0); }"
5122npx @shaderbase/cli submit https://www.shadertoy.com/view/XsXXDn
5223```
5324
5425### MCP (for AI agents)
5526
5627Add to your Claude config:
28+
5729``` json
5830{
5931 "mcpServers" : {
@@ -64,25 +36,55 @@ Add to your Claude config:
6436}
6537```
6638
67- Tools: ` search_shaders ` , ` get_shader ` , and ` submit_shader `
39+ Tools: ` search_shaders ` , ` get_shader ` , ` submit_shader `
40+
41+ ## How it works
42+
43+ 1 . ** Shaders live in git** — each has a ` shader.json ` manifest, GLSL source, and integration recipes
44+ 2 . ** CI builds the registry** — static JSON deployed to CDN
45+ 3 . ** Agents use MCP** — remote server with search and retrieval tools
46+ 4 . ** Humans use the CLI** — ` npx @shaderbase/cli add <shader> --env r3f `
47+ 5 . ** Files are copied into your project** — no runtime dependency, you own the code
6848
69- ## Repository Map
49+ ## Development
7050
71- | Path | Purpose |
72- | ------| ---------|
73- | ` shaders/ ` | Canonical shader corpus |
74- | ` packages/schema/ ` | Zod manifest validation + types |
75- | ` packages/cli/ ` | CLI package (` shaderbase ` on npm) |
76- | ` packages/mcp/ ` | MCP server (Cloudflare Worker) |
77- | ` scripts/ ` | Build and validation scripts |
78- | ` apps/web/ ` | Web app (browse, search, detail pages) |
79- | ` docs/ ` | Git contract, plans |
51+ ### Prerequisites
52+
53+ - [ Bun] ( https://bun.sh ) v1.3+
54+ - [ Node.js] ( https://nodejs.org ) v22+
55+
56+ ### Setup
57+
58+ ``` bash
59+ bun install
60+ bun run dev:web # dev server on :3000
61+ bun run check # test + typecheck + validate + build
62+ bun run build:registry # generate dist/registry/
63+ bun run test # run all tests
64+ bun run validate:shaders # validate shader manifests
65+ ```
66+
67+ ### Project structure
68+
69+ ```
70+ shaders/ Shader corpus (source of truth)
71+ packages/
72+ schema/ Zod manifest validation + types
73+ cli/ CLI: search, add, submit (@shaderbase/cli on npm)
74+ mcp/ MCP server (Cloudflare Worker)
75+ apps/web/ SolidJS web app (browse, search, detail pages)
76+ scripts/ Registry build + shader validation
77+ ```
8078
8179## Contributing
8280
83- See [ CONTRIBUTING.md] ( CONTRIBUTING.md ) for the provenance bar and submission checklist.
81+ See [ CONTRIBUTING.md] ( CONTRIBUTING.md ) for provenance rules and the submission checklist.
8482
8583Submissions can be made via:
86- - The CLI: ` npx @shaderbase/cli submit <glsl-or-url> ` (AI parses your GLSL, creates a PR)
87- - The MCP ` submit_shader ` tool (for AI agents)
88- - Direct pull request to the ` shaders/ ` directory
84+ - ** CLI** : ` npx @shaderbase/cli submit <glsl-or-url> `
85+ - ** MCP** : ` submit_shader ` tool
86+ - ** Pull request** : directly to ` shaders/ `
87+
88+ ## License
89+
90+ [ MIT] ( LICENSE )
0 commit comments