Shaders
header.lightDarkMode D
Gallery

Cracked Crystal 2

Cracked Crystal

A glowing neon-style abstract shape composed of nested, rounded rectangular loops arranged horizontally against a pure black background. The primary shape features three concentric curved bands that create an organic, flowing form reminiscent of a stylized infinity symbol or interconnected loops. The outermost band glows with a vibrant magenta-purple luminescence (#d321ff, #9c11d6) with crystalline faceted surfaces that refract light, creating bright highlights along the upper left edge. The middle and inner bands follow the same curved path, creating visual depth through layered transparency. The entire structure exhibits a faceted crystal-like texture with geometric patterns across its surface, suggesting a 3D crystalline material. A soft purple glow radiates outward from the shape, blending into the black background with a halo effect. The lighting appears to come from the upper left, creating bright specular highlights on the faceted surfaces while maintaining darker shadow areas on the right side. The overall atmosphere is futuristic and ethereal, with the purple luminescence creating a sense of energy and motion despite the static composition. Subtle godrays with a dark purple tint (#37004a) emanate from within the structure, adding atmospheric depth. The color space is linear P3, enhancing the vibrancy and saturation of the purple tones.

Code

vue
<script setup lang="ts">
import {
  Shader,
  Blob,
  Crystal,
  Glow,
  Godrays,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#0a0a0a" />
    <Blob :center="{ x: 0.49, y: 0.56 }" color-a="#0d0714" color-b="#170b1c" :deformation="0.6" highlight-color="#d321ff" :highlight-x="-0.4" :seed="36" :size="0.6" :softness="1" />
    <Crystal :cutout="true" :dispersion="0.54" :edge-softness="0.05" :facets="3" :fresnel="0.28" fresnel-color="#c8dbfa" :fresnel-softness="0.52" :highlights="0.4" :light-angle="172" :shadows="0.5" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/isQWoyQoe0qA_sdf.bin" tint-color="#9c11d6" :tint-intensity="0.4">
      <Godrays background-color="#d47dff" :center="{ type: 'mouse-position', reach: 0.05, originX: 1, originY: 0, momentum: 0.15, smoothing: 0.25 }" :density="0.5" :intensity="1" ray-color="#37004a" :speed="2" :spotty="0.7" />
    </Crystal>
    <Glow :intensity="0.5" :size="33" :visible="true" />
  </Shader>
</template>