Binary Rays

A digital matrix-style effect displaying cascading binary code (1s and 0s) on a dark background. The composition features a CRT screen aesthetic with visible scanlines running horizontally across the entire image, creating a retro computer monitor appearance. The binary characters are rendered in varying shades of blue and cyan, with some characters appearing brighter and more saturated while others fade into the darker background. The text appears to flow and swirl with a subtle motion effect, creating depth through the Swirl component. Blue god rays emanate from the right side of the image, creating volumetric light streaks that add atmospheric depth. A subtle sine wave distortion runs horizontally across the middle section, creating a gentle undulating effect. The overall color palette is dominated by deep navy and dark blue tones with bright cyan and light blue accents for the text and light effects. The pixelated quality and scanline intensity give it an authentic CRT monitor feel with slight color shifting at the edges. The atmosphere is cyberpunk and technological, evoking themes of digital data, hacking, and digital surveillance.

<script setup lang="ts">
import {
  Shader,
  Ascii,
  CRTScreen,
  Godrays,
  SineWave,
  Swirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <CRTScreen :brightness="2.5" :color-shift="10" :curvature="0" :pixel-size="108" :scale-to-fill="0" :scanline-frequency="150" :scanline-intensity="0.56">
      <Swirl :blend="88" :coarse-x="50" :coarse-y="50" color-a="#010b17" color-b="#040617" :detail="1.8" :fine-x="50" :fine-y="50" :medium-x="50" :medium-y="50" />
      <Ascii characters="01010101010101010101010101 " font-family="Space Mono">
        <Godrays :center="{ x: 1, y: 0.5 }" :density="0.08" ray-color="#78a7ff" :speed="1.02" />
        <SineWave :amplitude="0.06" color="#3c4f8f" :frequency="0.6" :position="{ x: 0.5, y: 0 }" :softness="0.83" :thickness="0.09" />
      </Ascii>
    </CRTScreen>
  </Shader>
</template>