Redacted Bars 8
Redacted BarsA modern neon shader effect featuring diagonal parallel lines arranged at approximately 31 degrees from horizontal, creating a sense of dynamic motion and depth. The lines transition smoothly from hot magenta/pink (#ff1a6d) on the left side through purple and blue hues to bright cyan (#0af0e8) on the right side, creating a vibrant color gradient across the composition. Each line has a glowing, luminescent quality with soft rounded edges and appears to have a trailing effect that suggests movement or velocity. The lines are rendered against a very dark navy-black background (#0a0d2b) which provides high contrast and makes the neon colors appear to glow intensely. The overall effect is reminiscent of speed lines, digital rain, or futuristic motion graphics. The spacing between lines is consistent and uniform, with approximately 13 lines visible across the frame. The gradient transitions smoothly across the spectrum using oklch color space, creating natural color transitions. There is a subtle depth and atmospheric quality enhanced by the tilt-shift effect applied, though with minimal blur intensity. The composition has a strong sense of forward motion and energy, typical of modern tech or gaming interfaces.
Code
<script setup lang="ts">
import {
Shader,
FallingLines,
LinearGradient,
SolidColor,
TiltShift
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#0a0d2b" />
<FallingLines id="idmmijuosi5e6y2didn" :angle="31" color-b="#cccccc00" color-space="oklab" :density="13" :speed="0.1" :speed-variance="0.15" :stroke-width="0.34" :trail-length="0.95" :visible="false" />
<LinearGradient color-a="#ff1a6d" color-b="#0af0e8" color-space="oklch" edges="mirror" :end="{ x: 1, y: 1 }" mask-source="idmmijuosi5e6y2didn" :start="{ x: 0, y: 0 }" />
<TiltShift :falloff="0.9" :intensity="100" :width="0" />
</Shader>
</template>