Light Leaks 2

A vibrant, highly blurred abstract shader composition featuring soft, flowing organic shapes with intense color gradients. The image displays a swirling vortex effect in the background created by the Swirl component, transitioning from dark navy blue (#0a1628) to magenta (#b54a98). Two prominent Blob shapes overlay this base: a cyan-to-lime-green gradient blob positioned in the left-center area with soft, luminous edges and a bright yellow-green blob on the right side with enhanced deformation and highlight intensity. The entire composition is heavily blurred with a bokeh-like quality, creating a dreamy, out-of-focus appearance. Chromatic aberration adds subtle color fringing at 45-degree angles, with red and blue channel offsets creating a slight 3D separation effect. A fine film grain texture overlays the entire image at low opacity (0.08 strength), adding subtle noise. The color space uses OKLCH for smooth, perceptually uniform color transitions. The overall mood is ethereal and dynamic, with soft glowing highlights suggesting 3D depth and luminosity. The spatial composition places the brightest elements in the center-right area, with darker tones dominating the edges.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="40" color-a="#0a1628" color-b="#b54a98" color-space="oklch" :detail="2.5" :speed="0.5" />
    <Blob :center="{ x: 0.32, y: 0.68 }" color-a="#01dcfe" color-b="#b7fba0" color-space="oklch" :deformation="1.5" highlight-color="#ffffff" :highlight-intensity="0.6" :opacity="0.55" :size="0.6" :softness="3" :speed="0.8" :visible="true" />
    <Blob :center="{ x: 0.7, y: 0.68 }" color-a="#91b75d" color-b="#d8f72b" color-space="oklch" :deformation="1.8" highlight-color="#ffffff" :highlight-intensity="0.7" :opacity="0.95" :softness="3.5" :speed="0.7" :visible="true" />
    <ChromaticAberration :angle="45" :blue-offset="1.5" :red-offset="-1.5" :strength="0.55" />
    <FilmGrain :strength="0.08" />
  </Shader>
</template>