Shadertoy是一个在浏览器中编写、编译并实时运行着色器程序的在线平台与创作社区，由伊尼戈·基莱斯(Íñigo Quílez)和波尔·赫雷米亚斯(Pol Jeremias)创办，2013年2月上线。平台以GLSL(OpenGL着色语言)为编程语言，借助WebGL调用图形处理器(GPU)的算力，用纯程序方式生成图像、动画、模型、光照和声音，作品公开后可被他人查看源码、评论与复用，被广泛用于计算机图形学的教学与实验。
定义
Shadertoy是一个运行在浏览器中的在线着色器编辑器与分享社区，用户在其中编写片段着色器代码，即可实时得到图像、声音或虚拟现实画面，并把作品发布给其他人浏览、学习和讨论[1]。它面向计算机图形学从业者、学者与爱好者，供他们通过GLSL代码交流渲染技术和程序化艺术[2]。
平台的基本单位是一个着色器程序。作者需要实现mainImage函数，由它根据像素坐标计算并输出该像素的颜色；程序会被自动施加到画面上的全部像素，并行执行由GPU完成[3]。除图像之外，着色器还可以通过mainSound函数生成声音、通过mainVR函数生成虚拟现实画面，二者都会被平台自动打上对应的标签，供检索筛选[1]。
原理
Shadertoy的着色器以GLSL编写。这是一种类似C语言的着色语言，运行在GPU上，除了整型与浮点型，还提供vec2、vec3、vec4等向量类型，向量与标量之间的运算按分量逐个进行，点积、叉积等线性代数运算被内置为函数[3]。平台通过WebGL把浏览器与GPU连接起来，从而获得生成程序化艺术、动画、模型、光照、基于状态的逻辑与声音所需的算力[2]。
编辑器向每个着色器注入一批只读的统一变量，用于提供逐帧变化的输入，包括画面分辨率iResolution、以秒计的运行时间iTime、帧间隔iTimeDelta、帧序号iFrame、鼠标状态iMouse、日期iDate、采样率iSampleRate以及可供采样的输入通道iChanneli等[1]。作者用这些变量驱动画面变化，例如把像素坐标归一化后配合iTime产生随时间变化的颜色，就得到一段动画[3]。
由于平台不提供外部模型与网格，画面中看似立体的几何体大多由距离场与光线步进(raymarching)方法在着色器内部生成：先用函数给出空间中任意点到场景表面的最短距离，再从摄像机出发沿视线按该距离反复前进步进，逐步逼近表面交点，进而计算法线与光照[4]。较复杂的作品会使用多趟渲染，把BufA、BufB等缓冲区依次渲染，其中一个缓冲区的输出可作为后续趟次的输入纹理，从而在同一作品内完成模糊、合成或时间上的累积反馈[5]。
发展历程
Shadertoy的源头可追溯到2009年。当时WebGL的初步实现在火狐浏览器中出现，伊尼戈·基莱斯随后做出了最早的在线实时编码环境与程序化着色器作品集，内容由18位来自Demoscene社区的作者捐赠，其中包含光线步进的融球、分形与隧道效果等当时网页上未曾出现过的实时交互动画[2]。
2012年12月，基莱斯与波尔·赫雷米亚斯决定在旧版基础上重建站点，在保留Demoscene风格与尺寸受限的实时图形内容的同时，加入用户主页、分享、嵌入等社区功能[2]。新版于2013年1月开发、同年2月上线[2]。上线之初即提供实时编辑、播放、浏览、检索、标签与评论等功能，并且在内容上只提供一组固定而有限的纹理，鼓励用户以创造性方式使用[2]。
此后平台陆续增加了摄像头与麦克风输入、视频、音乐、虚拟现实渲染和多趟渲染等能力[2]。2013年7月，两位创办者在ACM SIGGRAPH的计算机动画节上介绍了这一面向反应式着色器的实时编码工具[6]。据2021年年中的统计，平台上的公开作品已超过5.2万件，来自数千名用户[2]；另有统计称其作品超过8.5万件、创作者超过5万人，来自100多个国家[7]。平台还举办年度竞赛与活动[2]。
应用
平台最主要的用途是学习与教学。作品源码必须公开，其他人可以直接查看、修改、实时运行并从中学习，因此它既是灵感来源，也是讲授着色、反应式渲染与GPU内部机制的素材库。有课程直接把在Shadertoy中编写并运行着色器作为计算机图形学的练习内容[3]。
在创作与工程实践中，平台常用作实时图形算法的原型试验场。用户在作品中尝试光线步进、程序化纹理、建模与动画、分形几何、图像压缩、体积渲染与运动模糊等多种算法。经由API接口，其他网站和应用程序也能查询并下载平台上的着色器，在自有软件中运行，单月请求量被限制在1500次以内[1]。
部分三维软件与合成软件提供了兼容模式，使平台上的单趟着色器可以复制粘贴后直接使用，或经过少量调整接入其自身的着色管线[8]。
局限
平台对创作素材做了刻意的限制：用户无法上传自己的纹理与网格模型，只能使用平台提供的固定纹理，因此想要做出差异化的画面必须另辟蹊径。这一设计迫使作者在算法层面寻找解法，但也意味着作品难以直接使用外部的美术资源。
平台本身不附带教程，默认使用者已经具备着色器编程基础，初学者需要借助外部资料入门[9]。作品中包含大量数学与算法知识，理解他人代码有一定门槛[4]。
多趟渲染的移植存在限制。由于合成图不能形成环，那些需要把某个缓冲区自身的内容读回来再计算同一缓冲区的效果，无法用节点化的方式重实现[5]。此外，向第三方软件迁移时，平台的统一变量不再作为统一变量传入，而是隐式地作为mainImage函数的参数，任何使用这些变量的辅助函数都必须显式接收它们，预处理器宏与着色器常量也不会被保留[8]。
参见
参考资料
- How To - Shadertoy BETA [引用日期2026-10-14]
- Shadertoy [引用日期2026-10-14]
- Assignment 5: Introduction to Computer Graphics [引用日期2026-10-14]
- 【ShaderToy】开篇 [引用日期2026-10-14]
- Shadertoy [引用日期2026-10-14]
- acm.org 上的网页 [引用日期2026-10-14]
- Shadertoy [引用日期2026-10-14]
- Shadertoy [引用日期2026-10-14]
- shaders [引用日期2026-10-14]