Retro Pop 4
Retro PopA dynamic gradient-based shader effect featuring diagonal stripes that flow at approximately 32 degrees across the composition. The primary visual consists of alternating bands of cyan (#9ee5ff) and magenta (#e49cff) colors creating a vibrant pastel aesthetic. The stripes have soft, feathered edges with a balance favoring the magenta tones (77% balance). A stretch distortion effect is applied with a center point slightly left of center and above the middle, creating a subtle warping that makes the stripes appear to bend and flow organically across the canvas. The overall effect has a smooth, wave-like quality where the parallel diagonal bands undulate gently. A dithering pattern (Bayer 4x4) is overlaid with a pixel size of 4, adding subtle texture and visual noise that prevents banding and creates a slightly grainy, retro-digital quality. The color space is linear, ensuring smooth transitions. The composition maintains full opacity throughout with normal blending, resulting in a cohesive, modern gradient effect with a soft, dreamy quality. The diagonal orientation combined with the stretch distortion creates a sense of movement and depth.
Code
<script setup lang="ts">
import {
Shader,
Dither,
Stretch,
Stripes
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<Stripes :angle="32" :balance="0.77" :density="4" :softness="0.57" />
<Stretch :angle="165" :center="{ x: 0.34, y: 0.37 }" :falloff="0.49" />
<Dither color-a="#9ee5ff" color-b="#e49cff" :threshold="0.66" />
</Shader>
</template>