Faded Dither 3
Faded DitherA warm, gradient background transitioning from pale golden-yellow in the upper left to a deeper, more saturated golden-tan in the lower right. The base is a solid color (#e3b354) with a subtle dithering effect applied using a Bayer 8x8 pattern that creates a fine, grainy texture throughout. The dithering uses transparent and light yellow (#f5d47f) colors to add depth and visual interest. Overlaid on this is a subtle sine wave pattern with white color, positioned in the upper-right quadrant at approximately 72% horizontally and 11% vertically. The sine wave has low amplitude (0.15) and moves at a slow speed (0.4), creating gentle undulating lines at an angle of 204 degrees. The overall effect is a warm, textured, and slightly animated gradient with minimal visual noise, creating a sophisticated and calming aesthetic. The dithering pattern is fine enough to appear as a subtle texture rather than obvious pixelation, while the sine wave adds a delicate, organic movement to the composition.
Code
<script setup lang="ts">
import {
Shader,
Dither,
SineWave,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#e3b354" />
<Dither color-b="#f5d47f" pattern="bayer8" :threshold="0.41">
<SineWave :angle="204" :frequency="0.5" :position="{ x: 0.72, y: 0.11 }" :softness="1" :speed="0.4" :thickness="0.8" />
</Dither>
</Shader>
</template>