Shaders
header.lightDarkMode D
Gallery

A flowing, organic gradient shader effect dominated by vibrant lime and green tones. The composition features smooth, undulating waves of color that blend seamlessly across the canvas. The primary colors transition from bright yellow-green (#b9ff5e) through neon lime (#b0ff05) to deep forest green (#08990f) and soft mint green (#7eff7a). The gradient creates a fluid, liquid-like appearance with soft, blurred edges that fade to transparency at the boundaries. A subtle halftone overlay with CMYK printing style is applied at 20% opacity using an overlay blend mode, adding fine texture and depth without overwhelming the smooth gradient base. The distortion parameter of 0.6 creates gentle wave-like undulations throughout the effect, giving it a sense of movement and organic flow. The overall atmosphere is fresh, natural, and energetic, reminiscent of flowing water or wind-swept foliage. The halftone pattern introduces microscopic dot patterns at 180 frequency, creating a subtle print-like texture that adds visual complexity while maintaining the smooth gradient appearance. The effect has no rotation or offset, maintaining perfect center alignment with transparent edges creating a soft vignette effect.

Code

vue
<script setup lang="ts">
import {
  Shader,
  FlowingGradient,
  Halftone
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <FlowingGradient color-a="#b9ff5e" color-b="#b0ff05" color-c="#08990f" color-d="#7eff7a" color-space="oklab" :distortion="0.6" :seed="73" />
    <Halftone blend-mode="overlay" :frequency="180" :opacity="0.2" style="cmyk" />
  </Shader>
</template>