Spray Paint 8

A sophisticated gradient shader effect featuring three animated blob shapes layered over a dark navy background (#0d0a1f). The composition creates a dynamic, fluid aesthetic with organic morphing forms. The top-right blob displays a vibrant red-to-magenta gradient (#8b0a3a to #ff1744) with high deformation (0.9) and prominent highlight intensity (0.7), creating a glowing hot spot effect. The bottom-left blob features deep purple tones (#1a0533 to #6c1d9e) with maximum deformation (1.0), adding dimensional depth. The center blob is the largest (1.1 scale) and blends dark blue (#0d1b2a) with a warm rose-pink (#e94560), creating a transitional color bridge between the cool and warm regions. All blobs utilize OKLCH color space for smooth perceptual transitions and feature soft edges with 2-3 unit softness values, creating a diffuse, atmospheric quality. A DiffuseBlur filter with 100% intensity is applied across the entire composition, softening all edges and creating a dreamy, out-of-focus aesthetic. The overall mood is moody and contemporary, with smooth color gradations flowing from dark navy through purple, magenta, and pink tones, creating a sense of depth and movement despite the static image.

Code

vue

<script setup lang="ts">
import {
  Shader,
  Blob,
  DiffuseBlur,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#0d0a1f" />
    <Blob :center="{ x: 0.82, y: 0.18 }" color-a="#8b0a3a" color-b="#ff1744" color-space="oklch" :deformation="0.9" highlight-color="#ff6b6b" :highlight-intensity="0.7" :highlight-x="0.2" :highlight-y="0.3" :highlight-z="0.7" :seed="55" :size="0.95" :softness="2.5" :speed="0.28" />
    <Blob :center="{ x: 0.15, y: 0.85 }" color-a="#1a0533" color-b="#6c1d9e" color-space="oklch" :deformation="1" highlight-color="#9b59b6" :highlight-x="0.4" :highlight-z="0.6" :seed="37" :size="0.75" :softness="2" :speed="0.3" />
    <Blob :center="{ x: 0.48, y: 0.52 }" color-a="#0d1b2a" color-b="#e94560" color-space="oklch" :deformation="0.7" highlight-color="#c44569" :highlight-intensity="0.6" :highlight-x="-0.3" :highlight-y="-0.4" :highlight-z="0.5" :seed="14" :size="1.1" :softness="3" :speed="0.25" />
    <DiffuseBlur edges="mirror" :intensity="100" :visible="true" />
  </Shader>
</template>