Shaders
header.lightDarkMode D
Gallery

A striking neon green glowing logo featuring a stylized 'G' shape with geometric cutouts, set against a pure black background. The letter is constructed with a thick, rounded form that creates a modern, tech-forward aesthetic. The interior displays a dynamic, swirling liquid effect with bright lime green (#12d32f, #61f533) flowing patterns that appear to move and shift. The glass material creates a glossy, refractive surface with visible light refraction and chromatic aberration effects, particularly noticeable at the edges where the green transitions to subtle cyan highlights. A bright yellow-white highlight (#ffe11a) appears as a specular reflection, suggesting a light source from the upper left. The swirl pattern inside the cutout creates organic, flowing motion with darker green undertones (#0a140e) providing depth and contrast. Wave distortions ripple across the surface at a frequency of 5.1, creating subtle undulating movement. The overall effect is highly polished and luminescent, with the neon green appearing to glow against the black void. Cursor ripples with chromatic split effects add interactive responsiveness. A subtle film grain overlay (0.075 strength) adds texture and prevents the image from appearing too sterile. The composition is perfectly centered with the logo occupying the frame's focal point, creating a professional, modern branding presentation with a cyberpunk aesthetic.

Code

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#0f0f0f" />
    <Glass :cutout="true" :fresnel="0.04" fresnel-color="#82ffc6" :fresnel-softness="0.48" :highlight="0.1" highlight-color="#dbe6ff" :highlight-softness="0.27" :light-angle="289" :refraction="0.82" :scale="1.1" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/5T7CT5qxxArz_sdf.bin" :thickness="0.37" :visible="true">
      <Swirl :blend="45" color-a="#0a140e" color-b="#12d32f" color-space="oklab" :detail="3.5" :speed="0.6" />
      <Blob blend-mode="linearDodge" :center="{ type: 'mouse-position', reach: 0.55, originX: 0.5, originY: 0.5, momentum: 0.3, smoothing: 0.3 }" color-a="#61f533" color-b="#46eb65" :deformation="0.9" :size="0.15" :softness="0.7" />
      <WaveDistortion :angle="23" edges="mirror" :frequency="5.1" :speed="2.5" :strength="0.15" :visible="true" />
      <CursorRipples :chromatic-split="2" :decay="5" :intensity="20" :radius="0.7" :visible="true" />
    </Glass>
    <FilmGrain :strength="0.075" :visible="true" />
  </Shader>
</template>