Shaders
header.lightDarkMode D
Gallery

Two stacked transparent glass cubes with a luminous blue glow effect against a pure black background. The cubes are rendered with high-quality glass material properties including refraction, fresnel effects, and chromatic aberration. The primary cube sits on top with a slightly offset smaller cube below it, creating an isometric 3D perspective. Bright blue light (#1944ff) swirls dynamically within and around the glass geometry, creating an animated fluid motion effect. The glass surfaces exhibit sharp edge highlights in white, with subtle internal reflections and light refractions visible through the transparent geometry. The fresnel effect creates a blue-tinted glow along the edges of the cubes, particularly visible on the upper surfaces and corners. A swirling pattern of blue and black colors flows through the interior of the glass structures, with the blue component being vibrant and saturated. The overall composition has a sleek, modern, tech-forward aesthetic with strong contrast between the luminous blue elements and the absolute black background. The lighting angle appears to come from the upper right, creating dimensional highlights on the cube surfaces.

Code

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#0a0a0a" />
    <Glass :aberration="0.89" :cutout="true" :edge-softness="0.2" :fresnel="0.01" :fresnel-softness="0.14" :refraction="1.09" :scale="0.7" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/EKiSRi_0Mh6g_sdf.bin" :thickness="0.27">
      <Swirl :blend="56" color-a="#1944ff" color-b="#0a0a0a" color-space="oklab" :detail="4.2" :speed="0.1" />
      <FlowField :detail="1" :evolution-speed="1.5" :speed="1.8" :strength="0.5" />
    </Glass>
  </Shader>
</template>