Vibrant Waves 2

A fluid, organic gradient composition featuring smooth flowing wave patterns that transition diagonally across the canvas. The image displays layered, undulating ribbons of color that create a sense of motion and depth. The primary color gradient flows from magenta and purple tones in the upper left, transitioning through blue-purple hues in the center, and culminating in cyan and light-blue tones in the lower right. The waves have soft, blurred edges with subtle shadow effects that create dimensional depth between the flowing layers. The distortion effects create organic, sinuous curves that appear to ripple and shift, with a sawtooth wave pattern adding fine detail and texture throughout. A soft bloom or glow effect is visible where colors transition, particularly in the cyan regions. The overall composition has a smooth, liquid quality with gentle blur applied selectively across the image, creating a dreamy, ethereal atmosphere. Fine film grain texture is subtly visible throughout, adding a slight grittiness to the otherwise smooth gradients. The effect suggests flowing liquid or atmospheric phenomena with a modern, digital aesthetic.

<script setup lang="ts">
import {
  Shader,
  Blob,
  FilmGrain,
  Swirl,
  TiltShift,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="54" color-a="#d512d8" color-b="#2b87f0" color-space="oklch" :detail="0.8" />
    <WaveDistortion :angle="137" edges="wrap" :frequency="1.8" :strength="0.2" :transform="{ scale: 1.3 }">
      <WaveDistortion :angle="204" edges="mirror" :frequency="10" :speed="0.3" wave-type="sawtooth">
        <Blob :center="{ x: 0.75, y: 0.77 }" color-a="#6b35ff" color-b="#1ecbe9" :deformation="1" highlight-color="#a61782" :highlight-x="-0.4" :highlight-y="-0.4" :highlight-z="1" :size="0.8" :softness="1" />
      </WaveDistortion>
    </WaveDistortion>
    <TiltShift :angle="205" :center="{ x: 0.53, y: 0.48 }" :falloff="0.4" :intensity="100" :width="0.5" />
    <FilmGrain :strength="0.2" />
  </Shader>
</template>