Frosted Glass 3

A sophisticated shader composition featuring a layered glass morphism effect with a soft, ethereal aesthetic. The background transitions smoothly from light blue-gray on the left (#ebf6ff) to a vibrant lime-green (#abe615) on the right, creating a gentle gradient. A prominent white glass shape with curved, organic edges dominates the center, featuring a frosted glass appearance with subtle refraction and chromatic aberration effects. The glass element has a soft blur of approximately 20 pixels with a fresnel highlight creating a luminous rim effect. A sine wave pattern in bright lime-green emerges from the lower right corner, adding dynamic movement and energy to the composition. The overall effect is enhanced by fine film grain texture overlaid at 30% opacity, giving it a subtle cinematic quality. The swirl component creates soft, flowing transitions between the cool and warm color zones. The composition has a modern, minimalist aesthetic with excellent depth perception created through the glass refraction and layering of semi-transparent elements.

Code

vue

<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="50" color="#abe615" :frequency="0.6" :position="{ x: 0.91, y: 1 }" :softness="0.8" :thickness="1" />
    <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>