Shaders
header.lightDarkMode D
Gallery

A serene, minimalist shader composition featuring a soft turquoise background (#7fdbcc) overlaid with an ASCII art pattern composed of block characters (▄, ║, █) in cream and light gray tones. The ASCII characters form vertical lines and rectangular shapes that create a subtle data visualization or rain-like effect across the canvas. Overlaying this is a godray effect with blue light rays (#3080c7) emanating from the top-right corner, creating volumetric light streaks that add depth and atmospheric quality. The rays have a soft, diffused quality with moderate density (0.2), producing a dreamy, ethereal mood. A paper texture with high roughness (0.85) and fine grain scale (3) is applied across all layers, adding tactile imperfection and organic quality to the otherwise digital composition. The overall effect suggests digital rain, data streams, or light filtering through a textured surface, with a calm, contemplative atmosphere enhanced by the cool color palette and soft lighting.

Code

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#7fdbcc" />
    <Ascii :cell-size="54" characters="▄║█" font-family="Geist Mono" :gamma="1.3">
      <Godrays background-color="#e4f0c9" :center="{ x: 1, y: 1 }" :density="0.2" :intensity="0.9" ray-color="#3080c7" :spotty="0" />
    </Ascii>
    <Paper :displacement="0" :grain-scale="3" :roughness="0.85" />
  </Shader>
</template>