Radial Overlap 7
Radial OverlapA soft, ethereal gradient shader effect featuring a predominantly white center that transitions smoothly into mint green and cyan tones toward the edges. The composition displays a swirling, organic pattern with triangular or wedge-shaped striations radiating from the right side, creating a sense of dynamic motion and depth. The effect combines a conic gradient with swirl distortion, producing flowing, wave-like formations that appear to ripple across the canvas. The pixelation effect is subtle, creating a slightly textured surface while maintaining smooth color transitions. The overall atmosphere is light, airy, and calming, with a luminous quality suggesting light rays or energy flowing through the composition. The blend of white and cyan-green creates a cool, refreshing aesthetic with soft, diffused edges that fade to transparency.
Code
<script setup lang="ts">
import {
Shader,
ConicGradient,
Pixelate,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<ConicGradient id="idmpiichpr7x5ibv89b" :center="{ x: 1, y: 0.04 }" 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="#ffffff" color-b="#57ffc1" 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>