Sunrise
SunriseA radial gradient composition featuring a luminous spherical form at the center with warm orange and yellow tones that gradually transition outward. The sphere exhibits a soft, glowing quality with a bright yellow-white highlight on the right side, creating a three-dimensional appearance. The core of the sphere displays rich orange (#fa722a) and golden yellow (#fad041) hues that blend smoothly. Surrounding the central blob is a pink-to-magenta gradient halo that creates a soft atmospheric glow effect. The outer background transitions to a deep periwinkle blue (#4e7fd9) that frames the composition. The overall effect is highly blurred and diffused, with no sharp edges visible anywhere in the image. The progressive blur effect creates a vignette-like quality where the center is in focus and gradually becomes more diffused toward the edges. The wave distortion is subtly applied, creating minimal rippling effects. A fine film grain texture is overlaid across the entire composition at low opacity, adding subtle texture without disrupting the smooth gradient transitions. The color space appears to use OKLCH and OKLAB color models, resulting in perceptually smooth transitions between warm and cool tones. The overall mood is ethereal, glowing, and dreamlike with a soft, meditative quality.
Code
<script setup lang="ts">
import {
Shader,
Blob,
FilmGrain,
ProgressiveBlur,
Swirl,
WaveDistortion
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<FilmGrain :animated="0" :strength="0.3">
<ProgressiveBlur :angle="90" :center="{ x: 0.5, y: 0.5 }" :falloff="0.47" :intensity="1000">
<Swirl :blend="5" :coarse-x="50" :coarse-y="50" color-a="#4e7fd9" color-b="#121bc9" color-c="#529ff7" color-space="oklch" :complexity="5.5" :detail="0.5" :fine-x="50" :fine-y="50" :medium-x="50" :medium-y="50" :scale="3" :speed="0.3" />
<Blob blend-mode="normal-oklch" color-a="#fad041" color-b="#fa722a" color-space="oklab" :deformation="0" highlight-color="#ffe01a" :highlight-intensity="0.35" :highlight-x="0.11" :highlight-y="-0.01" :highlight-z="0.13" :softness="0.43" />
<WaveDistortion :angle="360" edges="mirror" :frequency="10" :speed="3.4" :strength="0.01" />
</ProgressiveBlur>
</FilmGrain>
</Shader>
</template>