Swirling Gradient 11

A dynamic swirl shader effect featuring concentric circular patterns with radial distortion emanating from the bottom center of the frame. The composition displays a prominent orange-to-blue color gradient that creates a warm-cool color contrast. The primary swirl component generates smooth, flowing curved bands of color that spiral outward with soft, blurred edges. Overlaid on this is a concentric spin effect with 9 rings that creates a tunnel-like or vortex appearance, with the center anchored at the bottom (y: 1.0). The rings rotate counterclockwise at a speed of -1.2, creating a sense of inward motion toward the bottom of the frame. A subtle paper texture with 0.15 displacement adds fine grain and organic roughness to the otherwise smooth gradients, breaking up the digital perfection with natural-looking noise. The overall effect has soft, feathered edges that fade to transparency, creating a vignette-like quality. The color space uses OKLAB for smooth perceptual color transitions. The atmosphere is energetic and fluid, with a sense of depth and movement pulling the viewer's eye toward the bottom center point.

<script setup lang="ts">
import {
  Shader,
  ConcentricSpin,
  Paper,
  Swirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl :blend="{ axis: 'x', type: 'mouse', momentum: 0.2, outputMax: 60, outputMin: 40, smoothing: 0.6 }" color-a="#f54b1c" color-b="#1a4d8c" color-space="oklab" :detail="1.2" />
    <ConcentricSpin :center="{ x: 0.5, y: 1 }" :rings="9" :smoothness="0.76" :speed="-1.2" :speed-randomness="0.14" />
    <Paper :roughness="0.2" />
  </Shader>
</template>