Frosted Glass 6
Frosted GlassA layered shader composition featuring a soft, diffused gradient background transitioning from vibrant hot pink (#ff1759) on the left side to pale blue-white (#ebf6ff) on the right side. The primary visual element consists of overlapping rectangular shapes with semi-transparent pink tones, creating a sense of depth and dimensionality. A prominent curved arc or swirl pattern emerges from the center, rendered in lighter pink with soft edges that blend seamlessly into the background. The glass effect component adds subtle refraction and chromatic aberration, creating a frosted or frosted-glass appearance with minimal highlight reflections. A fine film grain texture is applied uniformly across the entire composition, adding subtle noise and tactile quality. The overall mood is soft, ethereal, and modern, with a dreamy quality enhanced by the 20-pixel blur radius on the glass element. The composition uses a centered anchor point with no rotation, creating a balanced, symmetrical presentation. The sine wave element at position (0.379, 1) contributes to the organic, flowing nature of the design.
Code
<script setup lang="ts">
import {
Shader,
FilmGrain,
Glass,
SineWave,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<Swirl color-a="#ebf6ff" color-b="#d3e4f0" :detail="1.5" />
<SineWave :amplitude="0.1" :angle="99" color="#ff1759" :frequency="0.6" :position="{ x: 0.38, y: 1 }" :softness="1" :thickness="0.9" />
<Glass :aberration="0.64" :blur="20" :edge-softness="0.05" :fresnel="0.03" :fresnel-softness="1" :highlight="0" :highlight-softness="1" :inner-zoom="2" :light-angle="237" :refraction="2" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/3qJFWUS-Vtnm_sdf.bin" :thickness="0.03" />
<FilmGrain :strength="0.3" />
</Shader>
</template>