Dither Wave 8
Dither WaveA gradient shader effect transitioning from a lighter mint-green at the top to a deeper turquoise-green at the bottom. The upper portion features a dithered pattern using a Bayer8 matrix with a pixelated appearance, creating a grainy texture that gradually fades into a smooth gradient. Overlaid on this is a subtle sine wave pattern rendered in white, positioned horizontally across the upper-middle section with soft edges and moderate amplitude. The wave creates a gentle undulating line effect with high softness (0.79), making it appear almost like a misty or ethereal horizontal band. The overall composition has a calm, minimalist aesthetic with smooth color transitions and a subtle animated quality from the wave component. The dithering effect adds visual interest without overwhelming the serene gradient base.
Code
<script setup lang="ts">
import {
Shader,
Dither,
SineWave
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<Dither color-a="#07e6b8" color-b="#abffd3" pattern="bayer8" :pixel-size="5" :threshold="0.32" :visible="true">
<SineWave :amplitude="0.1" :frequency="0.7" :position="{ x: 0.5, y: 0 }" :softness="0.79" :thickness="0.81" />
</Dither>
</Shader>
</template>