Use as background / container for React components ? about shadertoy-react HOT 2 CLOSED

What kind of background do you need?

If you are willing to get a classic background: in CSS just pass a style uniform to your component this way:

<ShadertoyReact style={{ background: "red" }} fs={fragmentShader} />

Just make sure to pass an alpha value to your gl_FragColor = vec4(r, g, b, a);

The other way of having a background is to directly render the background image or color in your shader and don't have a transparent shader.

from shadertoy-react.

@revskill10 -- you can wrap it in a container and then set the ShaderToy component to position: absolute with a z-index of 0 and then the text with a z-index of 1

from shadertoy-react.