Dot Gradient 3

A warm gradient background transitioning from golden yellow on the left side to vibrant orange in the center and coral-red tones on the right side. The gradient flows diagonally from upper-left to lower-right with smooth color transitions. A subtle wave distortion effect is applied at a 317-degree angle, creating gentle undulating ripples across the entire surface that add organic movement and fluidity to the composition. Overlaid on top is a fine dot grid pattern with small yellowish-green dots scattered across the surface using a linear dodge blend mode, creating a twinkling, starry effect that appears to shimmer and glow against the warm background. The dots are small and densely distributed, giving the impression of particles or stars floating in space. The overall effect is warm, energetic, and slightly ethereal with a sense of depth and movement.

Code

vue

<script setup lang="ts">
import {
  Shader,
  DotGrid,
  LinearGradient,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <LinearGradient color-a="#f7bb4f" color-b="#ff6024" color-space="oklch" edges="mirror" :end="{ x: 0.03, y: 0.24 }" :start="{ x: 0.26, y: 0.59 }" />
    <WaveDistortion :angle="317" :frequency="0.6" :strength="0.33" />
    <DotGrid blend-mode="linearDodge" color="#d8fa2d" :dot-size="0.04" :twinkle="1" />
  </Shader>
</template>