Digital Activation 4

A dark, tech-noir shader effect featuring a deep black background (#0e0f14) with a subtle dot grid overlay in dark gray (#292936) creating a fine matrix pattern across the entire canvas. The dominant visual element is a glass ring structure positioned in the upper portion of the image, centered horizontally but offset toward the top. This ring exhibits a bright lime-green glow (#55ff0a) that creates a luminous halo effect with chromatic aberration, giving it a glassy, refractive quality. The ring appears to be a thick-walled circular form with a ring SDF shape (radius 0.8, thickness 0.15) that's scaled to 1.45x. Inside the ring structure, there's an ASCII character pattern using the characters '◘•' rendered in the same lime-green color, creating a pixelated, digital aesthetic. The spiral effect within generates a swirling motion from a point in the upper-left quadrant, blending from dark blue (#0a131f) to bright green (#55ff0a). The overall atmosphere is cyberpunk and digital, with strong contrast between the near-black background and the vibrant neon green accents. The glass effect includes refraction (value 2), edge softness (0.2), and fresnel effects that enhance the three-dimensional, translucent quality of the ring structure. The composition creates depth through layering: background grid, glass ring with internal content, and animated spiral elements.

<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" :center="{ x: 0.5, y: 1 }" :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.8, thickness: 0.15 }">
      <SolidColor color="#0e0f14" />
      <Ascii characters="◘•" :gamma="0.8" :spacing="0.8">
        <Spiral :center="{ x: 0.07, y: 0.66 }" color-a="#0a131f" color-b="#55ff0a" :softness="0.4" />
      </Ascii>
    </Glass>
  </Shader>
</template>