Toggle Sidebar B
Light & dark mode D

Crystal

Diamond-like crystal lens with faceted refraction.

Diamond-like crystal lens with faceted refraction.

Props

PropTypeDefaultDescription
centerposition{"x":0.5,"y":0.5}Center position of the crystal shape
scalerange1Scale of the crystal shape (1 = default size)
cutoutcheckboxfalseCut out alpha outside the crystal shape
refractionrange0.5How strongly the crystal refracts content beneath
dispersionrange0.5Prismatic rainbow dispersion - splits light into spectral colors
facetsrange5Symmetry order - how many times the facet pattern repeats around the center
fresnelrange0.05Fresnel rim glow intensity around the crystal boundary
fresnelSoftnessrange1Fresnel rim width - higher values spread the glow further inward
fresnelColorcolor#ffffffColor of the fresnel rim glow
edgeSoftnessrange0Softness of the crystal boundary edge
innerZoomrange1.5Magnification of content seen through the crystal
lightAnglerange270Light direction angle in degrees
highlightsrange0.5Additive brightness on light-facing facets - never darkens
shadowsrange0.3Darkening on shadow-facing facets - never brightens
brightnessrange1.2Overall crystal brightness - higher values push facets toward brilliant white
tintColorcolor#e8e0ffCrystal body tint color
tintIntensityrange0How much tint color is applied to the crystal interior
tintPreserveLuminositycheckboxtruePreserve original brightness when tinting
shapeshape{"type":"polygonSDF","radius":0.35,"sides":10}Serialized shape configuration (JSON)
shapeSdfUrlshape-uploadURL to a pre-generated SDF .bin file
shapeType-Active SDF shape type

Usage

vue
<Shader>
  <Crystal>
    <Circle />
  </Crystal>
</Shader>