Subtle Liquid
Subtle LiquidA vibrant gradient shader effect dominated by purple and blue hues with a soft, luminous quality. The composition features a primary linear gradient transitioning from magenta (#be04cf) in the lower-left area to deep blue (#0000f7) in the upper-right, creating a diagonal flow across the canvas. Overlaid on this base is an organic blob shape with purple (#7835ff) and magenta (#cd0ced) coloring, positioned centrally with soft, feathered edges that create a glowing, three-dimensional appearance. A subtle highlight with yellowish tone (#ffe11a) is visible in the upper-right quadrant of the blob, adding depth and luminosity. The entire composition is enhanced with a fine film grain texture at low opacity (0.09) that adds subtle noise and texture without overwhelming the smooth gradients. A barely perceptible dot grid with white dots at 15% opacity and linear dodge blending creates a starfield-like effect across the surface. The liquify effect with moderate intensity (2) and mirror edge handling creates subtle wave distortions throughout, giving the gradients a fluid, organic quality. The overall mood is ethereal and cosmic, with soft transitions between colors and a glowing, dreamlike atmosphere. The color space uses OKLCH for perceptually uniform color transitions.
Code
<script setup lang="ts">
import {
Shader,
Blob,
DotGrid,
FilmGrain,
LinearGradient,
Liquify
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<LinearGradient color-a="#be04cf" color-b="#0000f7" color-space="oklch" edges="mirror" :end="{ x: 0.67, y: 0.28 }" :start="{ x: 0.23, y: 0.7 }" :visible="true" />
<Blob blend-mode="normal-oklch" color-a="#7835ff" color-b="#cd0ced" color-space="oklch" :deformation="0.9" :size="1" :softness="2" :speed="1" />
<DotGrid blend-mode="linearDodge" :density="40" :dot-size="0.05" :opacity="0.15" />
<Liquify :decay="1" edges="mirror" :intensity="2" :radius="2" :swirl="0" />
<FilmGrain :strength="0.09" />
</Shader>
</template>