Geogrid 10

A vibrant gradient background transitioning from deep purple (#7355fe) on the left side to cyan and light-green (#91e040) on the right side, creating a smooth diagonal color flow. The composition features geometric line patterns overlaid throughout: a fine diagonal crosshatch grid pattern in the upper left corner with thin cyan lines, and bold parallel diagonal lines in the center-left area creating a 3D perspective effect. These linear elements appear to be rendered with a glowing, neon-like quality with soft edges. The wave distortion effect creates subtle undulations across the geometric patterns, giving them a fluid, organic movement while maintaining their structured appearance. A grid distortion with wrapping edges adds subtle warping to the overall composition. The blend modes create additive lighting effects where elements overlap, particularly visible in the hardLight blending of the grid components. The overall atmosphere is modern, digital, and dynamic with a tech-forward aesthetic. The opacity and layering create depth, with the geometric patterns appearing to float above the gradient base. The color space uses OKLAB for smooth, perceptually uniform color transitions.

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="18" color-a="#7355fe" color-b="#91e040" color-space="oklab" :detail="0.9" :speed="1.5" />
    <WaveDistortion :angle="235" blend-mode="linearDodge" edges="mirror" :frequency="0.7" :speed="0.5" :strength="0.8" wave-type="triangle">
      <Grid blend-mode="hardLight" :cells="28" color="#00a2fa" :thickness="3.2" :transform="{ offsetX: -0.69, scale: 0.75 }" />
    </WaveDistortion>
    <GridDistortion :decay="1.8" edges="wrap" :grid-size="8" :intensity="5" :radius="1.75" />
  </Shader>
</template>