Spray Paint 7
Spray PaintA smooth, blurred gradient shader featuring warm sunset tones transitioning across the canvas. The composition consists of four animated blob elements layered over a dark blue base (#1a2e6b). The upper right features a large orange-to-golden blob (#ff7b2e to #ffba6b) centered at coordinates (0.85, 0.18) with soft highlights creating a luminous glow effect. The upper left contains a smaller red-coral blob (#e8443a to #ff6f52) positioned at (0.12, 0.25) with warm peachy highlights. The lower center area features a golden-yellow blob (#c9a02e to #f5d76e) at (0.48, 0.88) with creamy highlights. All blobs employ OKLCH color space interpolation for smooth transitions and include 3D highlight positioning (highlightX, highlightY, highlightZ) creating dimensional depth. A diffuse blur filter with 100% intensity and mirror edge handling is applied across the entire composition, creating a soft, dreamy aesthetic with no hard edges. The overall effect produces a warm, glowing atmosphere reminiscent of a sunset or sunrise with organic, flowing shapes that appear to gently animate. The color transitions are seamless due to the softness parameter (2-3) on each blob and the final blur pass.
Code
<script setup lang="ts">
import {
Shader,
Blob,
DiffuseBlur,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#1a2e6b" />
<Blob :center="{ x: 0.85, y: 0.18 }" color-a="#ff7b2e" color-b="#ffba6b" color-space="oklch" :deformation="0.9" highlight-color="#ffe0a3" :highlight-intensity="0.7" :highlight-x="0.2" :highlight-y="0.3" :highlight-z="0.7" :seed="42" :size="1.05" :softness="2" :speed="0.35" />
<Blob :center="{ x: 0.12, y: 0.25 }" color-a="#e8443a" color-b="#ff6f52" color-space="oklch" :deformation="0.7" highlight-color="#ffad85" :highlight-x="0.4" :highlight-z="0.6" :seed="23" :size="0.75" :softness="2" :speed="0.25" />
<Blob :center="{ x: 0.48, y: 0.88 }" color-a="#c9a02e" color-b="#f5d76e" color-space="oklch" :deformation="1" highlight-color="#fff4c2" :highlight-intensity="0.6" :highlight-x="-0.3" :highlight-y="-0.4" :highlight-z="0.5" :seed="7" :size="0.85" :softness="3" :speed="0.3" />
<DiffuseBlur edges="mirror" :intensity="100" :visible="true" />
</Shader>
</template>