Synthesis

A smooth gradient shader effect transitioning from dark navy/black in the upper right to vibrant magenta and pink tones in the lower left and center. The composition features two primary sine wave components creating soft, glowing light sources - a blue glow positioned in the lower-center-right area with moderate softness (0.55), and a magenta/hot-pink glow slightly offset above it with similar softness (0.54). These waves blend using OKLCH color space for smooth color transitions. A wave distortion effect at 299 degrees adds subtle undulating movement across the entire surface, creating a liquid, flowing quality. The overall atmosphere is moody and atmospheric with a modern, neon-inspired aesthetic. Film grain at 0.07 strength adds subtle texture without overwhelming the smooth gradients. The dark navy base (#08071a) provides deep contrast against the bright pink (#f00e94) and blue (#0582e8) accents, creating a striking visual depth. The edges fade to transparency, allowing the effect to blend seamlessly. The lighting appears to emanate from multiple sources creating an ethereal, glowing quality typical of modern UI design and digital art.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#08071a" />
    <SineWave :amplitude="0.36" blend-mode="normal-oklch" color="#0582e8" :frequency="0.2" :position="{ x: 0.65, y: 0.67 }" :softness="0.55" :speed="0.3" :thickness="0.72" />
    <SineWave :amplitude="0.17" blend-mode="normal-oklch" color="#f00e94" :frequency="0.2" :position="{ x: 0.6, y: 0.51 }" :softness="0.54" :speed="0.5" :thickness="0.35" />
    <WaveDistortion :angle="299" :frequency="0.3" :speed="0.2" :strength="1" />
    <FilmGrain :strength="0.07" />
  </Shader>
</template>