Faded Dither 4
Faded DitherA soft, serene gradient background transitioning from light cyan-turquoise at the top to a slightly deeper mint-green tone toward the bottom. The base color is a warm turquoise (#8edece) providing the foundational hue. Overlaid on this is a subtle dithering pattern using a Bayer 8x8 matrix with a lighter cyan-green color (#adf0e5) creating a fine, granular texture across the entire surface. The dithering effect is applied with moderate opacity and a threshold of 0.41, producing a delicate speckled appearance that adds visual interest without overwhelming the smooth gradient. Embedded within the dither layer is a sine wave element rendered in white (#ffffff) positioned in the lower-right quadrant of the composition, creating subtle undulating wave patterns with low amplitude (0.15) and frequency (0.5). The wave moves at a slow speed (0.4) at an angle of 245 degrees, contributing a gentle, flowing motion to the otherwise static background. The overall effect is calming and minimalist, with a modern, digital aesthetic. The edges maintain transparency, and the blend mode is set to normal, allowing all layers to composite naturally without color distortion. The atmosphere is peaceful and contemporary, suitable for a clean, minimal design interface.
Code
<script setup lang="ts">
import {
Shader,
Dither,
SineWave,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#8edece" />
<Dither color-b="#adf0e5" pattern="bayer8" :threshold="0.41">
<SineWave :angle="245" :frequency="0.5" :position="{ x: 0.47, y: 0.78 }" :softness="1" :speed="0.4" :thickness="0.8" />
</Dither>
</Shader>
</template>