LED Flow

A predominantly dark, nearly black background (#0c061a) with subtle dotted patterns visible in the upper left and center areas. The dotted patterns appear as fine white/light gray points arranged in a grid formation, creating a sparse constellation-like effect. A swirling distortion effect is visible in the center-right area, manifesting as curved lines in dark red/maroon tones that create a twirl or vortex pattern. A linear gradient overlay transitions from bright lime green (#1aff00) in the upper left to blue (#0000ff) in the lower right, but this gradient is heavily masked and only visible where the dotted grid and swirl effects exist, creating isolated pockets of color against the dark void. The overall effect is ethereal and cosmic, with a film grain texture adding subtle noise throughout. The composition suggests a deep space or digital void aesthetic with minimal but precise geometric elements creating visual interest against the overwhelming darkness.

<script setup lang="ts">
import {
  Shader,
  DotGrid,
  FilmGrain,
  Group,
  LinearGradient,
  SolidColor,
  Swirl,
  Twirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Group id="idmjrnv6c0pom01tg0f" :visible="false">
      <Swirl :blend="100" color-a="#ffffff" color-b="#000000" :detail="3" mask-source="idmjrnuq8x4whbsr7v9" />
      <DotGrid id="idmjrnuq8x4whbsr7v9" :density="60" :dot-size="0.12" :visible="false" />
      <Twirl :center="{ x: 0.85, y: 0.91 }" edges="wrap" :intensity="-1.2" :visible="true" />
    </Group>
    <SolidColor color="#0c061a" />
    <LinearGradient color-space="oklch" edges="mirror" :end="{ x: 0.76, y: 0.63 }" mask-source="idmjrnv6c0pom01tg0f" mask-type="luminance" :start="{ x: 0.16, y: 0.21 }" />
    <FilmGrain :strength="0.03" />
  </Shader>
</template>