Pixel Haze 3

A smooth, flowing gradient shader with a swirling vortex effect that creates a mesmerizing color transition. The composition features a dominant yellow (#fdca51) in the upper left and right portions, transitioning through warm orange and coral tones toward the center. A deep purple-blue (#3f48b3) vortex dominates the lower right and center areas, creating a spiral-like distortion pattern. The swirl effect generates organic, curved wave patterns that flow diagonally from upper-left to lower-right. A subtle dithering pattern with a bayer4 grid overlay adds fine texture and visual noise throughout, creating a grainy, pixelated quality at approximately 5-pixel intervals. The grid distortion effect introduces subtle warping and undulation across the surface, with a decay of 3 creating a ripple-like appearance that emanates from the center. Film grain adds a final layer of analog texture with 0.2 strength, enhancing the organic, hand-crafted feel. The overall atmosphere is warm yet cool, with a dreamlike, ethereal quality. The edges fade to transparency, creating a soft, feathered boundary. The color space uses oklch for smooth, perceptually uniform transitions between the warm and cool tones.

<script setup lang="ts">
import {
  Shader,
  Dither,
  FilmGrain,
  GridDistortion,
  Sharpness,
  Swirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="30" color-a="#fdca51" color-b="#3f48b3" color-space="oklch" :detail="1.2" :speed="0.6" />
    <Dither blend-mode="overlay" :pixel-size="5" :spread="0.92" :threshold="0.31" />
    <GridDistortion edges="mirror" :grid-size="75" :intensity="5" :radius="2" />
    <Sharpness :sharpness="1" />
    <FilmGrain :strength="0.2" />
  </Shader>
</template>