React Shaders is an open source library for creating GLSL/WebGL shaders with support for modern shader bindings like those in Shadertoy. react-shaders is built on top of Morgan Villedieu's shadertoy-react.
index.tsx (React) |
example.glsl (GLSL) |
|---|---|
import { Shader } from 'react-shaders'
import code from './example.glsl'
return (
<Shader fs={code} />
) |
void mainImage(out vec4 O,in vec2 I){
I=.5-(I/iResolution.xy);
vec3 col=.5+vec3(I,.5*sin(iTime));
I*=vec2(1.,iResolution.y/iResolution.x);
float z=.5*sin((dot(I,I)+iTime*5e-2)/.01);
O=vec4(col*(1.+z),1.);} |
npm i react-shaders |
pnpm i react-shaders |
bun add react-shaders |