Ice Spheres 3
Ice SpheresA dynamic shader effect featuring a dark, moody atmosphere with an orange-to-red gradient glow emanating from the center-left area. The primary visual element is a perforated or mesh-like pattern of circular holes arranged in a regular grid, creating a honeycomb or speaker-grille appearance. These circular apertures are backlit with warm orange light (#ff6a3d), creating strong contrast against the deep black background. The holes vary in size and intensity, with denser concentration in the center-right transitioning to sparse, smaller holes toward the edges. The effect has a three-dimensional quality with depth perception created by the gradient falloff and focus blur. The swirling base layer provides subtle color variation between dark purple-black (#0c0c1c, #1a0a12) and the vibrant orange accent. The glass tiles component creates a refractive, crystalline quality that distorts and fragments the underlying swirl pattern, adding complexity and visual interest. The overall mood is dramatic, technological, and energetic with a warm color temperature dominated by the orange glow against cool dark tones.
Code
<script setup lang="ts">
import {
Shader,
Blob,
GlassTiles,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<Swirl :blend="10" color-a="#0c0c1c" color-b="#1a0a12" :detail="2.8" :speed="0.8" />
<GlassTiles :intensity="40" mask-source="idmjrma2hqerhhnv380" :rotation="30" :roundness="1" :tile-count="25">
<Swirl :blend="8" color-a="#0c0c1c" color-b="#ff6a3d" :detail="2.8" :speed="0.8" />
</GlassTiles>
<Blob id="idmjrma2hqerhhnv380" :center="{ x: 0.35, y: 0.28 }" :deformation="1.5" :highlight-intensity="0" :highlight-x="-1" :highlight-y="-1" :highlight-z="-1" :size="0.75" :softness="1.2" :speed="0.6" :visible="false" />
</Shader>
</template>