Toggle Sidebar B
Light & dark mode D

Duotone

Map colors to two tones based on luminance

Map colors to two tones based on luminance

Props

PropTypeDefaultDescription
colorAcolor#ff0000First color (used for darker areas)
colorBcolor#023af4Second color (used for brighter areas)
blendrange0.5Blend point between the two colors
colorSpace"linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch"linearColor space for color interpolation

Usage

vue
<Shader>
  <Duotone>
    <Circle />
  </Duotone>
</Shader>