Deep Signal 5

A dark, atmospheric shader effect dominated by deep navy and black tones with subtle blue linear wave patterns. The composition features parallel horizontal lines that create a sense of depth and movement, flowing across the canvas with varying intensity. The lines appear to originate from the upper-center area and curve downward toward the bottom-left and bottom-right corners, creating a wave-like distortion effect. The overall aesthetic is minimalist and technological, with a film grain texture adding subtle noise throughout. The blue highlights are extremely subtle, appearing as faint glowing accents within the wave patterns, particularly visible in the upper-center region. The effect creates a sense of motion and fluidity despite being static, with the linear patterns suggesting electromagnetic waves or digital data streams. The color palette transitions smoothly between very dark navy (#080f1a) and slightly lighter dark blue (#0b0b29), with minimal contrast to maintain the moody, sophisticated atmosphere. The entire composition has a glossy, almost liquid quality with the wave distortions creating the illusion of a curved surface or fabric being gently manipulated.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl color-a="#080f1a" color-b="#0b0b29" color-space="oklch" />
    <WaveDistortion :angle="344" blend-mode="linearDodge" edges="wrap" :frequency="2.9" :strength="0.1" :transform="{ scale: 1.3 }">
      <WaveDistortion :angle="354" edges="mirror" :frequency="80" :speed="0.3" :strength="1">
        <Blob :center="{ x: 0.2, y: 0.98 }" color-a="#020117" color-b="#0b0a2e" :deformation="0.7" highlight-color="#0051ff" :highlight-intensity="0.6" :highlight-x="0.1" :highlight-y="-0.2" :highlight-z="0.1" :size="0.8" :softness="1" />
      </WaveDistortion>
    </WaveDistortion>
    <FilmGrain :strength="0.05" />
    <Blob blend-mode="colorDodge" :center="{ x: 0.36, y: 0.67 }" color-a="#3535ff" color-b="#1e47e9" :deformation="2" :opacity="0.08" :softness="2" />
    <Twirl :center="{ x: 0.67, y: 0 }" edges="mirror" :intensity="-1.7" />
  </Shader>
</template>