Orb & Sphere Playground

Interactive playground for every orb, sphere, and aura component. Adjust all color-driving props in real time.

AuraOrb

7-layer chakra-responsive visualization. 4 variants × 6 states. Canonical visual engine.

components/ai/AuraOrb.tsx

VariantStateCoherence70Size (px)200Show Grainon

7-Factor Scoresstability70vitality65agency75connection60expression68clarity80wholeness55

Colors In Use

#8e66fbclarity primary

#EDE9FEclarity light

#5B21B6clarity dark

rgba(142, 102, 251, 0.4)clarity glow

Not Renderable in Playground

UnifiedOrb — Fixed-position floating panel with internal hooks (XP ring, notification dots). Its visual core is AuraOrb (tab 1 above).

ArchetypeOrb3D — Requires React Three Fiber <Canvas> wrapper + WebGL context. Colors from ARCHETYPE_VISUALS[type].primaryColor: oraclewarriorhealersovereign+ 8 more