Shaders
header.lightDarkMode D
Gallery

A sleek, modern logo composition featuring a spherical glass orb on the left side with sophisticated optical properties. The orb displays realistic glass refraction and reflection with a subtle gradient from light to dark, creating depth and dimensionality. The sphere has a polished, translucent quality with highlights that suggest light hitting curved surfaces. Adjacent to the orb is the word 'Galileo' rendered in a thin, elegant sans-serif typeface with a metallic or chrome-like appearance. The background is a very dark navy-black (#130f1a) that creates high contrast with the lighter elements. Within and around the glass sphere, there are subtle swirling patterns in dark grays and purples (#26262b, #0d111a, #b700ff, #a600ff) that suggest internal movement or energy. The overall effect is enhanced by chromatic aberration effects visible as subtle purple and magenta color fringing around the glass element. A fine film grain texture is applied across the entire composition, adding a cinematic quality. The lighting angle appears to come from approximately 237 degrees, creating realistic specular highlights on the glass surface. The entire composition has a premium, technological aesthetic with a cool color temperature dominated by deep purples, dark blues, and metallic grays against the near-black background.

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 base-color="#a600ff" down-color="#d400ff" left-color="#6300ff" :momentum="10" :radius="2" right-color="#7b00ff" up-color="#b700ff" />
    </Glass>
    <FilmGrain :opacity="0.1" />
  </Shader>
</template>