Plastic

Glossy molded plastic with photorealistic studio reflections, driven in a custom shape

Props

  • origin

    Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre.

    Type
    string
    Default
    center
  • center

    Center position of the plastic shape

    Type
    {x: number, y: number}
    Default
    {"x":0.5,"y":0.5}
  • scale

    Scale of the plastic shape (1 = default size)

    Type
    number
    Default
    1
  • rotation

    Rotation of the plastic shape in degrees

    Type
    number
    Default
    0
  • colorA

    Body color at the start of the gradient

    Type
    string
    Default
    #f5f5f7
  • colorB

    Body color at the end of the gradient

    Type
    string
    Default
    #d9dade
  • stops

    Multi-stop gradient colors (overrides Color A / Color B when set)

    Type
    object
    Default
    null
  • gradientAngle

    Direction of the body color gradient in degrees

    Type
    number
    Default
    90
  • colorSpace

    Color space for gradient color interpolation

    Type
    "linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch"
    Default
    linear
  • thickness

    Puffiness — how far the rounded bevel reaches inward from the edge before the surface flattens

    Type
    number
    Default
    0.5
  • roughness

    Surface roughness — 0 = polished gloss with crisp mirror reflections, 1 = matte satin

    Type
    number
    Default
    0.12
  • reflectivity

    Strength of the environment reflections and specular highlights

    Type
    number
    Default
    1
  • crumple

    Surface crumple — irregular dents that break reflections into hard organic shapes, like blown or vacuum-formed plastic

    Type
    number
    Default
    0.25
  • crumpleScale

    Size of the crumple dents — higher = smaller, denser dents

    Type
    number
    Default
    1
  • crumpleCoverage

    How much of the surface is crumpled — 0 = pristine, 0.5 = patches of crumple, 1 = fully crumpled

    Type
    number
    Default
    1
  • seed

    Random seed — re-rolls the crumple pattern for reflection variety

    Type
    number
    Default
    0
  • edgeSoftness

    Softness of the shape boundary edge

    Type
    number
    Default
    0.05
  • lightAngle

    Direction the studio key light comes from, in degrees

    Type
    number
    Default
    315
  • speed

    Speed of the environment drift — the studio reflections slowly orbit the surface. 0 pauses.

    Type
    number
    Default
    1
  • shading

    Diffuse shading contrast — how strongly the body darkens away from the light

    Type
    number
    Default
    0.35
  • rim

    Fresnel rim light intensity on grazing surfaces

    Type
    number
    Default
    0.25
  • rimColor

    Color of the fresnel rim light

    Type
    string
    Default
    #ffffff
  • shape

    Shape to render — choose from 11 built-in analytical shapes or supply a custom SDF. See the Shape Effects guide for all available shapes and their options.

    Type
    ShapeConfig
    Default
    sphere3D
  • shapeSdfUrl

    URL to a pre-generated SDF `.bin` file — when non-empty, activates SVG mode and triggers a shader recompile. See the Shape Effects guide for how to generate an SDF from an SVG.

    Type
    string
    Default
    ""

Usage

<Shader>
  <Plastic />
</Shader>