Floating Glass 4

A sophisticated 3D shader effect featuring a glossy, translucent spherical or orbital form rendered against a deep dark background. The primary visual element is a crescent-shaped glass object with a highly reflective surface, positioned centrally and exhibiting strong light refraction properties. The object displays a vibrant color gradient transitioning from deep magenta/pink (#eb316c) on the outer edges to warm golden-yellow (#e8d058) on the illuminated highlights, with dark navy-blue undertones (#1a1c38) in the shadowed regions. The glass material demonstrates pronounced Fresnel effects along its edges, creating bright white highlights that suggest light reflection and refraction. The surface exhibits subtle internal distortion and a soft, diffused glow emanating from within. A flowing gradient base layer provides organic color variation beneath the glass effect. The overall composition uses a tritone color mapping system that creates rich, saturated tones with smooth transitions between the dark, magenta, and yellow color channels. The background remains pure black, allowing the luminous object to command full visual attention. Fine dithering patterns are subtly applied, adding texture and preventing color banding. The lighting angle appears to come from approximately 276 degrees, creating dramatic side-lighting that emphasizes the three-dimensional form and glass-like material properties.

<script setup lang="ts">
import {
  Shader,
  Circle,
  Dither,
  FlowingGradient,
  Glass,
  SolidColor,
  Tritone
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Circle id="idmnayde0qhf56tj00g" :center="{ x: 0.5, y: 0 }" :radius="2.2" :softness="0.53" :visible="false" />
    <SolidColor color="#000000" />
    <FlowingGradient color-b="#9c9c9c" color-c="#a1a1a1" color-d="#d4d4d4" color-space="linear" mask-source="idmnayde0qhf56tj00g" :seed="49" />
    <Glass :aberration="0" :center="{ y: 0.5, type: 'mouse-position', reach: 0.05, originX: 0.5, originY: 0.5, momentum: 0.1, smoothing: 0.7 }" :edge-softness="0.15" :fresnel="0.15" :fresnel-softness="1" :highlight="0.25" :highlight-softness="0.52" :light-angle="276" :refraction="0.86" :shape="{ type: 'crescentSDF', radius: 0.77, innerRatio: 0.43, offset: 0.36, rotation: 0 }" :thickness="1" />
    <Tritone color-a="#1a1c38" color-b="#eb316c" color-c="#e8d058" :visible="true" />
    <Dither color-mode="source" pattern="blueNoise" :pixel-size="2" :threshold="0.62" />
  </Shader>
</template>