ColorWheel

A directional gradient that smoothly cycles through rainbow colors or a custom set of three colors

Props

  • mode

    Rainbow cycles through the full spectrum; Custom loops through your three chosen colors

    Type
    "rainbow" | "custom"
    Default
    rainbow

  • colorA

    First color in the cycle

    Type
    string
    Default
    #ff0000

  • colorB

    Second color in the cycle

    Type
    string
    Default
    #00ff88

  • colorC

    Third color in the cycle

    Type
    string
    Default
    #0066ff

  • scale

    Number of color cycles across the viewport

    Type
    number
    Default
    1

  • angle

    Direction the gradient flows

    Type
    number
    Default
    0

  • speed

    Speed at which the gradient cycles

    Type
    number
    Default
    0.05

  • colorSpace

    Color space for blending between custom colors

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

Usage

<Shader>
  <ColorWheel />
</Shader>