City Grid 4

A dark, atmospheric digital effect featuring a pixelated plasma animation against a near-black background. The composition shows purple and magenta pixels arranged in a grid pattern that gradually increases in density and intensity toward the bottom third of the frame, creating a wave-like or rising effect. The pixels vary in brightness and saturation, with the most vibrant purple tones (#8c00ff) concentrated in the lower portion, while the upper two-thirds fade into sparse, dimly lit pixels against the very dark background (#09060f). The pixelation effect has a scale of 74 with rounded corners (0.2 roundness), giving each pixel a slightly softened square appearance. The overall mood is technological and ethereal, with a sense of digital energy or data visualization rising from the bottom. The plasma effect underneath creates organic, flowing color variations within the pixelated structure, with a warp of 0.4 and high contrast (1.6) that makes the purple tones pop against the black areas. The effect appears to be animated, with the sine wave modulation controlling the gap spacing to create a dynamic, pulsing quality.

<script setup lang="ts">
import {
  Shader,
  Pixelate,
  Plasma,
  SineWave,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#09060f" />
    <Pixelate :gap="{ type: 'map', curve: 0.35, source: 'idmmbhthud5inxgebqc', channel: 'alphaInverted', inputMax: 1, inputMin: 0, outputMax: 1, outputMin: 0.16 }" :roundness="0.2" :scale="74">
      <Plasma :balance="57" color-a="#8c00ff" :contrast="1.6" :density="3.3" :intensity="1.8" />
    </Pixelate>
    <SineWave id="idmmbhthud5inxgebqc" :amplitude="0.1" :position="{ x: 0.5, y: 1 }" :softness="0.8" :thickness="0.7" :visible="false" />
  </Shader>
</template>