Afternoon Sunlight

Open in editor

A soft, minimalist shader effect displaying a subtle grayscale composition. The image features a light gray background (#c4c4c4) as the base layer, overlaid with delicate Worley noise patterns that create organic, cellular-like structures. The noise generates a subtle texture with variations between light taupe (#a69f9f) and off-white (#fcf8f0) tones, producing a gentle, cloud-like appearance. A linear blur effect at 36 degrees with high intensity (300) creates directional motion streaks that soften the entire composition, giving it a dreamy, ethereal quality. Chromatic aberration with minimal strength (0.15) introduces very subtle color fringing at the edges of the blur, with red offset at -1 and blue offset at 1, creating barely perceptible color separation. The overall effect is soft, diffused, and atmospheric with a muted, monochromatic palette dominated by grays and off-whites. The blur and noise work together to create a sense of gentle movement and organic flow across the canvas. The mood is calm, serene, and slightly abstract.

Code

vue

<script setup lang="ts">
import {
  Shader,
  Blob,
  ChromaticAberration,
  LinearBlur,
  SolidColor,
  WorleyNoise
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Blob id="idmozyext3ts4o5d9ra" :center="{ x: 0.26, y: 0.07 }" color-a="#000000" color-b="#000000" :size="0.85" :softness="1.5" :speed="0.8" :visible="false" />
    <SolidColor color="#c4c4c4" />
    <WorleyNoise color-a="#a69f9f" color-b="#fcf8f0" :contrast="0.55" :lacunarity="2.3" mask-source="idmozyext3ts4o5d9ra" mode="f2MinusF1" :octaves="2" :persistence="1" :scale="3" :seed="33" :speed="3.3" />
    <LinearBlur :angle="36" :intensity="300" :visible="true" />
    <ChromaticAberration :strength="0.15" :visible="true" />
  </Shader>
</template>