Drifting Lights 2

A smooth, blended gradient shader effect transitioning horizontally from left to right. The left side features a vibrant magenta (#e106a9) that gradually transitions through pink and mauve tones in the center, ultimately shifting to a bright lime-green (#52b744) on the right side. The gradient uses OKLab color space for smooth perceptual blending, creating soft, natural color transitions without harsh banding. A rectangular coordinate system overlay with 3x scale creates subtle geometric structure and depth perception across the composition. Fine film grain texture with 0.3 strength is applied uniformly across the entire surface, adding a subtle cinematic quality and reducing the smoothness of the gradient. The grain creates a slightly textured, analog appearance while maintaining the overall smooth gradient flow. The effect has a horizontal linear gradient axis running from left (x:0) to right (x:1) at the vertical center (y:0.5), with the angle set to auto-animate in a loop, though the current frame shows the static gradient state. The overall mood is modern, vibrant, and slightly ethereal with balanced saturation across the color spectrum.

<script setup lang="ts">
import {
  Shader,
  FilmGrain,
  LinearGradient,
  RectangularCoordinates
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <LinearGradient :angle="{ mode: 'loop', type: 'auto-animate', speed: 1, easing: 'linear', outputMax: 360, outputMin: 0 }" color-a="#52b744" color-b="#e106a9" color-space="oklab" />
    <RectangularCoordinates edges="stretch" :scale="3" />
    <FilmGrain :strength="0.3" />
  </Shader>
</template>