Geogrid 3

A 3D perspective grid visualization rendered in neon purple and magenta tones against a deep black background. The composition features two intersecting planes that converge toward a vanishing point, creating a tunnel-like effect. The primary plane features a diagonal hatching pattern with purple lines (#6a2fbf) creating a mesh of parallelograms that recede into depth. The secondary plane above displays a finer grid pattern with smaller cells, also in purple. The wave distortion effect creates subtle undulation across the grid lines, giving them a rippling, organic quality despite their geometric nature. The grid thickness is approximately 3.5 pixels with a hardLight blend mode that creates luminous edges. The overall effect suggests a digital landscape or data visualization with strong perspective distortion. The color palette transitions subtly between dark purple (#1e0c3a) and brighter magenta (#6a2fbf), with the brightest lines appearing to glow against the black void. The gridDistortion component adds subtle warping to the geometric structure, creating a sense of movement and energy. The atmosphere is distinctly cyberpunk and technological, evoking digital space or virtual reality visualization.

<script setup lang="ts">
import {
  Shader,
  Grid,
  GridDistortion,
  Swirl,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="22" color-a="#0a0814" color-b="#1e0c3a" color-space="oklab" :detail="0.6" :speed="1.5" />
    <WaveDistortion :angle="337" blend-mode="linearDodge" edges="mirror" :frequency="0.7" :strength="0.6" wave-type="triangle">
      <Grid blend-mode="hardLight" :cells="29" color="#6a2fbf" :thickness="3.5" :transform="{ scale: 0.75 }" />
    </WaveDistortion>
    <GridDistortion :decay="1.8" edges="wrap" :grid-size="8" :intensity="5" :radius="1.75" />
  </Shader>
</template>