Illuminated Clouds 3

A soft, blurred gradient shader effect dominated by cool tones creating an ethereal, atmospheric appearance. The composition features a dark central area with a deep charcoal-black (#111117) base that transitions smoothly into vibrant green and cyan hues around the edges. The effect creates a sense of depth with a dark triangular or angular shape in the center that appears to recede into the background. The flowing gradient component generates organic, wave-like color transitions moving from dark teal (#001512) through forest green (#134010) to bright cyan (#19ffc2) and lime green (#53ff35). The entire effect is heavily blurred with soft focus, creating a dreamy, out-of-focus quality reminiscent of bokeh or shallow depth of field photography. A subtle film grain texture overlays the entire composition, adding a slight noise pattern that enhances the organic, natural feel. The color space uses oklab for smooth perceptual transitions. The overall mood is cool, calming, and slightly mysterious, with the bright neon greens and cyans creating visual interest against the dark base. The effect suggests movement and fluidity despite being a static composition.

Code

vue

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#111117" />
    <Fog id="idmo78g2qa8dpr72ig3" :blending="0.9" color-b="#000000" :detail="3" :mouse-influence="0.4" :seed="243" :visible="false" />
    <FlowingGradient color-a="#001512" color-b="#134010" color-c="#19ffc2" color-d="#53ff35" color-space="oklab" :distortion="0" mask-source="idmo78g2qa8dpr72ig3" mask-type="luminance" :seed="34" :speed="4" />
    <FilmGrain :strength="0.075" />
  </Shader>
</template>