Arrow Skies 5

A vibrant gradient shader effect transitioning vertically from bright yellow (#fff700) at the bottom to deep blue (#0000ff) at the top, passing through orange and magenta hues in the middle. The entire composition is overlaid with a repeating pattern of small arrow characters (↖↗) in varying opacity, creating a directional flow effect. The arrows appear in lighter shades in the yellow-orange regions and darker shades in the purple-blue regions, following the underlying gradient. A subtle godray effect with linear dodge blending adds luminous rays emanating from the bottom center, creating depth and atmospheric glow. The wave distortion applied to the arrow pattern creates subtle undulating movement across the characters. A large circular glow with soft edges and yellow color (#ffdd00) is positioned at the bottom center, enhancing the light source effect. The overall mood is energetic and dynamic, with a sense of upward movement and radiant energy. The color space uses OKLCH for smooth perceptual transitions between hues.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <LinearGradient color-a="#fff700" color-space="oklch" :end="{ x: 0.5, y: 0 }" :start="{ x: 0.5, y: 1 }" />
    <Godrays blend-mode="linearDodge" :center="{ x: 0.5, y: 1 }" :density="0.11" :intensity="0.7" :opacity="0.2" ray-color="#87b4ff" :speed="2" :visible="true" />
    <Ascii characters="↖↖↗↗">
      <LinearGradient color-a="#fff700" color-space="oklch" :end="{ x: 0.5, y: 0 }" :start="{ x: 0.5, y: 1 }" />
      <WaveDistortion :angle="61" :frequency="2.2" :speed="3.9" :strength="0.5" />
      <Circle blend-mode="normal-oklch" :center="{ x: 0.53, y: 1 }" color="#ffdd00" :radius="1.87" :softness="1" />
    </Ascii>
  </Shader>
</template>