Watercolor on Paper 5

A vibrant multi-point gradient shader effect displaying a smooth color transition across the canvas. The composition features five distinct color nodes creating a fluid, organic blend: deep dark purple (#1a0a2e) positioned in the upper right, bright neon pink (#ff2d55) anchored in the lower left, pure black (#0d0d0d) at the center, vivid orange (#ff6b00) in the lower right, and rich purple (#4a0072) on the left side. The gradient creates soft, glowing transitions between these points with high smoothness (value 2), producing a dreamy, atmospheric quality. A sine wave distortion with 0.42 strength at 265 degrees adds subtle undulating movement to the color boundaries, creating a liquid, flowing effect. The liquify effect with intensity 10 and stiffness 15 further softens edges and creates organic, melting transitions between color zones. A fine paper texture with 0.1 grain scale and minimal displacement (1) adds subtle surface detail without overwhelming the gradient. Film grain at 0.1 strength introduces a cinematic quality with fine noise throughout. The overall effect is a warm-to-cool color journey with smooth, blurred transitions and a slightly textured, organic appearance. The edges fade to transparency, creating a vignette-like effect that draws focus toward the center.

<script setup lang="ts">
import {
  Shader,
  FilmGrain,
  Liquify,
  MultiPointGradient,
  Paper,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <MultiPointGradient color-a="#1a0a2e" color-b="#ff2d55" color-c="#0d0d0d" color-d="#ff6b00" color-e="#4a0072" :position-a="{ x: 0.95, y: 0.02 }" :position-b="{ x: 0.05, y: 0.95 }" :position-c="{ x: 0.5, y: 0.5 }" :position-d="{ x: 0.92, y: 0.88 }" :position-e="{ x: 0.08, y: 0.35 }" />
    <WaveDistortion :angle="265" :frequency="0.9" :strength="0.42" />
    <Liquify :damping="0.7" :radius="1.5" :stiffness="15" />
    <Paper :displacement="1" :grain-scale="0.1" :roughness="0.1" :seed="42" />
    <FilmGrain :strength="0.1" />
  </Shader>
</template>