Shaders
header.lightDarkMode D
Gallery

A vertical striped pattern composed of candlestick-like shapes in varying heights, creating a rhythmic, wave-like visual rhythm across the composition. The background is a deep dark purple (#381652), while the foreground features tall rectangular bars in light pink/lavender (#f5c6e2) arranged in vertical columns with consistent spacing. The bars vary in height to create an undulating pattern that resembles financial candlestick charts or audio waveforms. A vibrant magenta godray effect (#8608ff) emanates from the left side, creating luminous rays that intersect with the striped pattern, producing a glowing, ethereal quality. The ASCII characters (▄║█) form the structural basis of the bars, creating a technical, digital aesthetic. A subtle paper texture overlay adds fine grain and slight roughness to the entire composition, reducing the flatness and adding tactile depth. The overall mood is cyberpunk and energetic, with the interplay of the dark background, bright pink bars, and magenta rays creating strong visual contrast and a sense of movement or data flow.

Code

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#381652" />
    <Ascii :cell-size="54" characters="▄║█" font-family="Geist Mono" :gamma="1.65">
      <Godrays background-color="#f5c6e2" :density="0.2" :intensity="0.9" ray-color="#8608ff" :spotty="0" />
    </Ascii>
    <Paper :displacement="0" :grain-scale="3" :roughness="0.85" />
  </Shader>
</template>