Cascading Markers 9

A dynamic shader effect displaying diagonal striped patterns at 45-degree angles with a dominant red color palette. The base layer consists of static dark purple-to-magenta stripes (#1a0a2e to #8b1a4a) creating a foundation pattern. Overlaid on this are falling animated lines in bright red (#e6283b) with dark blue accents (#0d1b3e), moving diagonally downward at moderate speed with 36 lines of density. The lines have a trail effect with 97% length retention and variable speed variance creating organic motion. A subtle twirl distortion effect is applied at coordinates (0.42, 0.71) with 35% intensity, creating a gentle vortex warping in the lower-right quadrant. A tilt-shift blur effect is centered at (0.32, 0.55) with a 141-degree angle, creating a focused band across the composition while the periphery softens with 70% falloff. The entire effect is unified with film grain texture at 20% strength, adding a subtle cinematic noise overlay. The overall mood is intense and energetic with a cyberpunk aesthetic, combining sharp geometric patterns with fluid motion and selective focus techniques.

<script setup lang="ts">
import {
  Shader,
  FallingLines,
  FilmGrain,
  Stripes,
  TiltShift,
  Twirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Stripes color-a="#1a0a2e" color-b="#8b1a4a" :density="1" :speed="0" />
    <FallingLines :angle="45" color-a="#e6283b" color-b="#0d1b3e" :density="36" :rounding="0" :speed="0.2" :speed-variance="0.45" :stroke-width="1.1" :trail-length="0.97" />
    <Twirl :center="{ x: 0.42, y: 0.71 }" edges="mirror" :intensity="0.35" />
    <TiltShift :angle="141" :center="{ x: 0.32, y: 0.55 }" :falloff="0.7" :intensity="100" :visible="true" :width="0.2" />
    <FilmGrain :strength="0.2" />
  </Shader>
</template>