Shaders
header.lightDarkMode D
Gallery

A sleek, modern logo design featuring the word 'Galileo' in a sophisticated outlined typeface against a very dark navy-black background (#130f1a). To the left of the text is a spherical glass orb with a polished, reflective surface that exhibits strong specular highlights and fresnel effects. The sphere displays realistic refraction and chromatic aberration, creating iridescent color shifts along its edges - particularly visible greens, blues, and subtle rainbow-like distortions. The glass material has a high-gloss finish with internal swirl patterns rendered in dark grays and blacks (#26262b, #0d111a), creating depth and internal movement within the sphere. The overall composition uses a glass shader effect with pronounced light angle at 237 degrees, creating dramatic side lighting that emphasizes the three-dimensional quality of the orb. A subtle film grain texture overlays the entire composition at low opacity (0.1), adding a cinematic quality. The lighting creates a sophisticated, premium aesthetic with the glass element appearing to float against the dark background. The color palette is predominantly dark and cool-toned, with accent highlights in white and subtle chromatic color shifts in the glass material.

Code

vue
<script setup lang="ts">
import {
  Shader,
  ChromaFlow,
  FilmGrain,
  Glass,
  SolidColor,
  Swirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#130f1a" :visible="true" />
    <Glass :cutout="true" :fresnel="0.04" :fresnel-softness="0.05" :highlight="0.5" :highlight-softness="0.21" :inner-zoom="1.5" :light-angle="237" :refraction="2" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/Fo7ahNLZwqrY_sdf.bin" :thickness="1">
      <Swirl color-a="#26262b" color-b="#0d111a" :detail="5" :speed="0.2" />
      <ChromaFlow :momentum="10" :radius="2" />
    </Glass>
    <FilmGrain :opacity="0.1" />
  </Shader>
</template>