Shaders
header.lightDarkMode D
Gallery

Cracked Crystal 6

Cracked Crystal

A luminous, organic abstract shape composed of nested curved ribbons with a glowing neon-like appearance against a deep black background. The shape features smooth, flowing S-curves that create three concentric oval forms with rounded rectangular cutouts in the center. The material appears crystalline and translucent with a frosted glass texture, emitting a soft white-to-lavender glow with bright highlights along the upper edges. The lighting creates a three-dimensional effect with specular highlights in pale blue-white (#c5cddb, #c8dbfa) positioned in the upper-left quadrant, suggesting directional illumination. A subtle ambient glow radiates outward from the entire form, creating a halo effect. The overall atmosphere is ethereal and futuristic, with the crystalline structure refracting light to produce subtle rainbow-like color shifts. The composition is centered and symmetrical, with the glow effect creating soft bokeh-like diffusion into the surrounding darkness. The material quality suggests polished crystal or frosted acrylic with high-index refraction properties.

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.52, y: 0.48 }" color-a="#141414" color-b="#212124" :deformation="0.6" highlight-color="#c5cddb" :highlight-x="-0.5" :highlight-y="0.1" :highlight-z="0.6" :seed="22" :size="0.6" :softness="1" />
    <Crystal :brightness="1.7" :cutout="true" :dispersion="0.62" :edge-softness="0.05" :facets="3" :fresnel="0.28" fresnel-color="#c8dbfa" :fresnel-softness="0.52" :highlights="0.25" :light-angle="272" :shadows="0.45" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/isQWoyQoe0qA_sdf.bin" :tint-intensity="1">
      <Godrays background-color="#c9c9c9" :center="{ type: 'mouse-position', reach: 0.05, originX: 1, originY: 0, momentum: 0.15, smoothing: 0.25 }" :density="0.5" :intensity="1" ray-color="#000000" :speed="2" :spotty="0.7" />
    </Crystal>
    <Glow :intensity="0.5" :size="33" :visible="true" />
  </Shader>
</template>