Frosted Glass 5

A soft, ethereal gradient background transitioning from vibrant magenta at the top to pale white at the bottom, with cyan-tinted undertones in the lower left. Two semi-transparent rectangular shapes with soft edges are positioned in the upper-center area, creating a layered glass-like effect with subtle refraction and blur. A large curved glass morphism element dominates the center, featuring a smooth arc shape with high transparency and chromatic aberration effects. The glass element exhibits frosted glass characteristics with a 20-pixel blur radius and subtle fresnel highlights along its edges. A delicate sine wave pattern in bright magenta curves through the composition at approximately 45% horizontal position, adding a dynamic linear element. The entire scene is overlaid with fine film grain texture at 30% strength, creating a subtle noise pattern that adds depth and reduces digital smoothness. The lighting appears to come from the upper right (237 degrees), creating soft highlights and a luminous quality throughout. The overall mood is modern, minimalist, and ethereal with a premium glass-morphism aesthetic.

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" color="#ff17e8" :frequency="0.6" :position="{ x: 0.45, y: 0 }" :softness="1" :thickness="0.7" />
    <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>