Digital Activation
Digital ActivationA striking digital shader effect featuring a luminous ring structure composed of bright lime-green pixelated squares arranged in a dense grid pattern. The ring appears to be a torus or donut shape with a hollow center, rendered against a very dark near-black background. The green pixels transition from fully opaque and tightly packed on the left and bottom portions of the ring to increasingly sparse and dispersed as they fade toward the right and top edges, creating a gradient dissolution effect. The ring exhibits a subtle 3D glass-like quality with chromatic aberration visible along the edges, giving it depth and refraction properties. The pixelated grid pattern maintains consistent square shapes throughout, with each pixel appearing to be approximately 0.1 units in size. A faint secondary dot grid pattern in dark gray underlays the entire composition, providing subtle texture to the black background. The overall aesthetic is cyberpunk and digital, with high contrast between the vivid neon green and the deep darkness, creating an intense, glowing appearance reminiscent of retro computer graphics or digital data visualization.
Code
<script setup lang="ts">
import {
Shader,
Ascii,
DotGrid,
Glass,
SolidColor,
Spiral
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#0e0f14" />
<DotGrid color="#292936" :density="49" :dot-size="0.1" />
<Glass :aberration="0.8" :cutout="true" :edge-softness="0.2" :fresnel="0" :fresnel-softness="0.23" :highlight="0" :highlight-softness="0.16" :light-angle="274" :refraction="2" :scale="1.45" :shape="{ type: 'ringSDF', radius: 0.39, thickness: 0.12 }">
<SolidColor color="#0e0f14" />
<Ascii characters="◘•" :gamma="0.8" :spacing="0.8">
<Spiral color-a="#0a131f" color-b="#55ff0a" :softness="0.4" />
</Ascii>
</Glass>
</Shader>
</template>