The four
The Hearth
The Stage & Studio
The Library
The Bazaar
The Bridge
The Observatory
The Council
The Forge
The Nexus
The Realms
Effects Grimoire
Ancient effects for the modern weaver. Browse glows, text effects, card styles, and animations. Copy the code to use in your own creations.
Quantum Glow
A pulsing purple glow effect using the quantum color palette.
<div className="glow-quantum">Content</div>
Cosmic Glow
A deep blue cosmic radiance with layered shadow depth.
<div className="glow-cosmic">Content</div>
Neurospark Pulse
A bright cyan pulse — the signature Sanctuary accent.
<div className="glow-neurospark">Content</div>
Rainbow Text
Smooth spectral flow across all pride colors.
<span className="rainbow-text">Rainbow text</span>
Quantum Weaver Text
The signature quantum weave gradient — purple to cyan.
<span className="quantum-weaver-text">Quantum text</span>
Cosmic Sparkle Text
Deep space shimmer with layered glow shadows.
<span className="cosmic-sparkle-text">Sparkle text</span>
Domain Quantum Card
Glass card with quantum gradient border and hover lift.
<Card variant="quantum">Content</Card>
Domain Cosmic Card
Deep space card with cosmic blue glow on hover.
<Card variant="cosmic">Content</Card>
Domain Council Card
Regal council card with aethelred deep purple gradient.
<Card variant="council">Content</Card>
Float Animation
Gentle floating motion — 6 second cycle.
<div className="animate-float">Floating</div>
Pulse Animation
Soft pulsing opacity — 2 second cycle.
<div className="animate-pulse">Pulsing</div>
Glow Animation
Quantum glow breathing — 2 second alternating cycle.
<div className="animate-glow">Glowing</div>
All effects are generated from COSMIC design tokens. Run npm run generate to regenerate.