compositeDestinationAtop: Inverse Alpha-Masked Overlay

Destination Rendering Within Source Boundaries

The destination atop composite operation constrains destination color rendering to source alpha regions while preserving source areas outside destination coverage.

$$\text{destinationAtop} = dst \times \alpha_{src} + src \times (1 - \alpha_{dst})$$

ライブエディター

const fragment = () => {
      const srcAlpha = uv.x
      const dstAlpha = float(0.35).smoothstep(0.25, uv.distance(vec2(0.5)))
      const srcColor = vec3(1, 0.3, 0.2)
      const dstColor = vec3(0.2, 0.4, 1)
      const src = vec4(srcColor, srcAlpha)
      const dst = vec4(dstColor, dstAlpha)
      return compositeDestinationAtopVec4(src, dst)
}