Lost Rays

A dynamic shader effect featuring layered visual components creating a cinematic, otherworldly atmosphere. The image displays prominent god rays emanating from a light source positioned in the upper-left to center area, with rays of pale blue-white light (#ccdaed) cutting through a dark background. The rays have a spotty, volumetric quality with moderate density (0.3) creating distinct light streaks. A tritone color grading system overlays the entire composition, blending deep dark blue-black shadows (#050817) with vibrant orange (#ffa200) midtones and cyan highlights (#3defff), creating a cool-to-warm color tension. A zoom blur effect radiates from approximately the center-right area with high intensity (100), creating a sense of motion and depth that pulls the viewer's eye inward. Fine film grain texture (0.09 strength) adds a subtle analog quality and visual noise throughout. The overall effect is moody and atmospheric with elongated, feathered shapes suggesting organic forms or particles suspended in space. The color palette transitions from deep navy and teal in the shadows to golden-yellow and cyan in the highlighted areas, creating a cinematic sci-fi or underwater aesthetic. The composition has a sense of movement and energy despite the static nature of the image.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Godrays background-color="#1829b5" :center="{ x: 0.23, y: 0.67 }" :intensity="0.58" ray-color="#ccdaed" :speed="0.7" />
    <FilmGrain :strength="0.09" />
    <Tritone color-a="#050817" color-b="#ffa200" color-c="#3defff" color-space="hsl" />
    <ZoomBlur :center="{ x: 0.37, y: 0.35 }" :intensity="100" />
  </Shader>
</template>