Faded Dither 9

A gradient shader effect transitioning from a lighter pink tone in the upper portion to a deeper magenta-red in the lower portion. The base layer is a solid color (#d42a5c) providing the foundational warm pink-red hue. Overlaid on top is a dither pattern using a Bayer 8x8 matrix that creates a subtle stippled texture throughout the image, with the dither effect transitioning between transparent and a brighter pink (#f46b93). The dither pattern is most visible in the mid-tones and creates a grainy, halftone-like appearance that adds depth and visual interest. Embedded within the dither layer is a sine wave effect positioned at coordinates (0.35, 0.28) with a white color, creating subtle undulating wave patterns that flow at an angle of 182 degrees. The sine wave has low amplitude (0.15) and frequency (0.5), making it a gentle, barely perceptible wave motion that adds organic movement to the otherwise static gradient. The overall effect is a soft, textured gradient with a subtle animated quality, creating a modern, digital aesthetic with a warm, energetic mood. The edges fade to transparent, and the entire composition maintains a cohesive pink-to-magenta color progression.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#d42a5c" />
    <Dither color-b="#f46b93" pattern="bayer8" :threshold="0.41">
      <SineWave :angle="182" :frequency="0.5" :position="{ x: 0.35, y: 0.28 }" :softness="1" :speed="0.4" :thickness="0.8" />
    </Dither>
  </Shader>
</template>