Shaders
header.lightDarkMode D
Gallery

A dark, atmospheric digital effect featuring a pixelated red plasma pattern that emerges from the right side of the image and gradually disperses toward the left. The background is a very dark near-black color (#09060f). The main visual element is a dynamic pixelated grid pattern composed of red and dark red squares of varying sizes and opacity, creating a wave-like or flowing motion from upper-right to lower-left. The pixelation effect has a scale of 74 with rounded corners (0.2 roundness), giving each pixel a slightly soft appearance. The red plasma underneath generates organic, turbulent patterns with high contrast (1.6) and intensity (1.8), creating a sense of energy and movement. The gap between pixels is modulated by an invisible sine wave mapped to the alphaInverted channel, creating a breathing or pulsing effect where pixels become more or less visible across the composition. The overall mood is technological, energetic, and somewhat ominous, with a strong sense of directional flow from right to left. The effect suggests data visualization, digital corruption, or energy discharge.

Code

vue
<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="#ff0000" :contrast="1.6" :density="3.3" :intensity="1.8" />
    </Pixelate>
    <SineWave id="idmmbhthud5inxgebqc" :amplitude="0.1" :angle="44" :position="{ x: 0.66, y: 0.54 }" :softness="1" :thickness="0.9" :visible="false" />
  </Shader>
</template>