Dither Wave 4

A smooth, flowing gradient shader with a diagonal directional flow from upper-left to lower-right. The composition features a primary linear gradient transitioning through multiple color zones: starting with vibrant magenta and hot pink in the upper-left quadrant, transitioning through coral and orange tones in the upper-center area, blending into salmon and rose pink in the middle sections, and culminating in deep purple and blue hues in the lower-right corner. The gradient uses the OKLAB color space for the primary layer and OKLCH for the secondary layer, creating smooth perceptual color transitions. A subtle halftone dot pattern is visible throughout, creating a fine pixelated texture that adds visual depth and prevents banding. The overall effect is a modern, vibrant color gradient with a soft, diffused quality. The angle of the primary gradient is set to 180 degrees with mirrored edges, while a secondary gradient at 48 degrees adds complexity to the color blending. The composition has a warm-to-cool temperature shift from left to right, creating visual movement and dimensionality.

<script setup lang="ts">
import {
  Shader,
  Dither,
  LinearGradient,
  SineWave
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <LinearGradient :angle="180" :center="{ x: 0.5, y: 0.5 }" color-a="#4f14d9" color-b="#ff006e" color-space="oklab" edges="mirror" :end="{ x: 0.9, y: 0.82 }" end-color="#0000ff" :start="{ x: 0.24, y: 0.03 }" start-color="#1aff00" />
    <Dither id="idmgijmh7s6y9u9f0ao" :opacity="0" :pixel-size="5" :threshold="0.24" :visible="false">
      <SineWave :amplitude="0.02" :angle="198" :frequency="1.6" :speed="1.9" :thickness="0.83" />
    </Dither>
    <LinearGradient :angle="48" :center="{ x: 0.5, y: 0.5 }" color-a="#cf9742" color-b="#eb13d5" color-space="oklch" edges="mirror" :end="{ x: 0.92, y: 0.71 }" end-color="#0000ff" mask-source="idmgijmh7s6y9u9f0ao" start-color="#1aff00" />
  </Shader>
</template>