Rolling Shadows 8

A multi-layered gradient composition with organic, fluid distortion effects. The image features a warm-to-cool color transition dominated by earthy tones. On the left side, deep forest green (#2b3a1e) and dark olive tones create a shadowy foundation. The center transitions through warm brown (#5c3d1a) and muted earth tones. The right side features a prominent warm golden-yellow (#d4b86a) that appears to glow and radiate outward, creating a focal point with soft, diffused edges. The gradient points are positioned asymmetrically, with the brightest golden tone anchored toward the upper-right quadrant. Wave distortion at 97 degrees creates subtle undulating ripples across the entire surface, giving the effect a liquid, breathing quality. A bulge effect centered near the lower-left area adds dimensional warping and depth, creating a sense of three-dimensional bulging or lens distortion. The overall atmosphere is warm and organic, with a paper texture overlay (displacement 0.24, grain scale 3) adding fine surface detail and tactile quality. The edges blend smoothly with transparent falloff, creating a vignette-like effect that draws focus toward the luminous center. The color space is P3-linear, ensuring rich color depth and smooth gradations.

<script setup lang="ts">
import {
  Shader,
  Bulge,
  MultiPointGradient,
  Paper,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <MultiPointGradient color-a="#2b3a1e" color-b="#5c3d1a" color-c="#1e2b16" color-d="#d4b86a" color-e="#3b2f1c" :position-a="{ x: 0.17, y: 0.35 }" :position-b="{ x: 0.62, y: 0.82 }" :position-c="{ x: 0.19, y: 0.74 }" :position-d="{ type: 'mouse-position', originX: 0.445, originY: 0.2890070921985816, momentum: 0.2, smoothing: 0.6 }" :position-e="{ x: 0.6, y: 0.24 }" />
    <WaveDistortion :angle="97" />
    <Bulge :center="{ type: 'mouse-position', originX: 0.37, originY: 0.6642984014209592, momentum: 0.3, smoothing: 0.8 }" :falloff="2" :radius="2" />
    <Paper :displacement="0.24" :grain-scale="3" :roughness="0.1" />
  </Shader>
</template>