Metallic Waves

A dynamic shader effect featuring diagonal streaking rays emanating from the upper portion of the frame, creating a sense of rapid motion and energy. The primary visual element consists of two layered godray effects: the first layer produces deep purple rays (#260870) originating from the top-center, moving downward with a speed of -1, creating a stationary yet intense beam pattern. The second layer overlays golden-yellow rays (#ffd414) from the top-left corner, moving at 0.28 speed with a normal-oklch blend mode, adding warmth and luminosity to the composition. A wave distortion effect with a 119-degree angle and bounce waveType at 2.9 speed creates subtle undulating ripples across the entire surface, giving the rays a fluid, organic quality rather than rigid lines. The background is a very dark purple-black (#0d0317), providing maximum contrast for the bright rays. A subtle film grain texture with 0.04 strength adds a cinematic quality and prevents the effect from appearing too smooth or artificial. The overall composition has a high-speed, ethereal quality with strong directional movement from top to bottom, suggesting motion, energy, or a supernatural phenomenon. The diagonal orientation of the rays (approximately 119 degrees) creates visual tension and dynamism.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Godrays background-color="#0d0317" :center="{ x: 0.5, y: 1 }" :density="0.05" :intensity="0.74" ray-color="#260870" :speed="-1" />
    <Godrays blend-mode="normal-oklch" :density="0.07" :intensity="0.47" ray-color="#ffd414" :speed="0.28" />
    <WaveDistortion :angle="119" edges="mirror" :frequency="4.6" :speed="2.9" :strength="1" wave-type="bounce" />
    <FilmGrain :strength="0.04" />
  </Shader>
</template>