Radial Overlap 6
Radial OverlapA dynamic abstract shader effect featuring flowing, layered wave-like structures in purple and dark tones. The composition consists of multiple curved, ribbon-like bands that sweep diagonally across the frame from upper left to lower right, creating a sense of motion and depth. The primary visual element is a Swirl effect generating organic, undulating patterns with smooth gradients transitioning between bright purple (#8c40ff) and deep dark purple/navy (#0d0929). The waves have soft, feathered edges that fade into transparency, creating a luminous glow effect particularly visible where the purple bands meet darker regions. The overall atmosphere is moody and sophisticated with a modern, tech-forward aesthetic. The pixelation effect is subtly applied with variable scale mapping, creating micro-texture variations that add visual complexity without overwhelming the smooth gradient transitions. The composition has strong directional flow with curved, organic shapes rather than geometric precision, suggesting fluid motion or energy waves. The lighting appears to emanate from within the purple bands, creating a self-illuminated quality against the dark background. The color space uses oklab for smooth, perceptually accurate color transitions.
Code
<script setup lang="ts">
import {
Shader,
ConicGradient,
Pixelate,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<ConicGradient id="idmpiichpr7x5ibv89b" :center="{ x: 0, y: 0 }" color-a="#ffffff" color-b="#ffffff00" :repeat="3" :rotation="{ mode: 'loop', type: 'auto-animate', speed: 0.1, outputMax: 360, outputMin: 0 }" :visible="false" />
<Swirl color-a="#8c40ff" color-b="#0d0929" color-space="oklab" :detail="1.7" :visible="true" />
<Pixelate :scale="{ type: 'map', curve: -0.65, source: 'idmpiichpr7x5ibv89b', channel: 'alpha', inputMax: 1, inputMin: 0, outputMax: 93, outputMin: 1 }" />
</Shader>
</template>