Toggle Sidebar B
Light & dark mode D

Form3D

Wraps child content onto a 3D raymarched shape with lighting.

Wraps child content onto a 3D raymarched shape with lighting.

Props

PropTypeDefaultDescription
shape3dshape3d{"type":"ribbon","angle":0,"twist":50,"width":40,"thickness":20,"seed":0}3D shape and its parameters
shape3dType-ribbonActive shape type - triggers recompile when shape is switched
centerposition{"x":0.5,"y":0.5}Center position of the shape on screen
zoomrange50Camera zoom level
glossinessrange50Specular highlight intensity and sharpness
lightingrange50Overall intensity of lighting effects
uvMode"stretch" | "mirror" | "wrap"stretchHow to handle UV coordinates at shape boundaries
speedrange1Animation speed - scales all spin rates

Usage

vue
<Shader>
  <Form3D>
    <Circle />
  </Form3D>
</Shader>