Flowing Dots 2

A dark, sophisticated shader effect featuring a central focal point with intricate chromatic aberration and iridescent distortion patterns. The composition shows a symmetrical, organic form rendered through a halftone dot grid pattern that transitions from dense white dots on the right side to sparse, fading dots on the left, creating a sense of depth and dimensionality. The central subject displays vivid color separation with cyan, magenta, yellow, and blue hues creating a prismatic, glitchy aesthetic typical of chromatic flow effects. The background is a deep charcoal-to-black gradient that provides stark contrast. Subtle film grain texture overlays the entire composition, adding analog authenticity. The dot grid mask creates a pixelated, pointillist appearance that gradually dissolves into the dark background. Cursor ripples with chromatic splitting would add interactive distortion waves. The overall mood is futuristic, digital, and somewhat unsettling with its combination of organic form and digital degradation.

Code

vue

<script setup lang="ts">
import {
  Shader,
  ChromaFlow,
  CursorRipples,
  DotGrid,
  FilmGrain,
  LinearGradient
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <DotGrid id="idmlsai28917usa8l1j" :density="40" :dot-size="{ type: 'map', source: 'idmlsaoh7xdy8aayjbd', channel: 'alpha', inputMax: 1, inputMin: 0, outputMax: 1, outputMin: 0 }" :twinkle="0.9" :visible="false" />
    <ChromaFlow id="idmlsaoh7xdy8aayjbd" :intensity="1.4" :radius="2.9" :visible="false" />
    <LinearGradient color-a="#1e1e1f" color-b="#070708" color-space="hsl" :end="{ x: 1, y: 0 }" :start="{ x: 0, y: 1 }" />
    <LinearGradient color-a="#000000" color-b="#ffffff" color-space="hsl" :end="{ x: 1, y: 0 }" mask-source="idmlsai28917usa8l1j" :start="{ x: 0, y: 1 }" />
    <CursorRipples />
    <FilmGrain :strength="0.1" />
  </Shader>
</template>