Development · Web app
Liquid Orb Editor
WebGPU visual editor for customizable liquid glass AI loading orbs
Liquid Orb Editor is a web-based playground for generating animated, liquid-glass visual orbs powered by WebGPU. It lets you tweak refraction, motion, glow, and audio reactivity, then copy the resulting code to use as AI thinking or status animations in your apps.
What it's for
- Design animated status orbs for AI chat interfaces
- Create interactive audio-reactive visualizers driven by microphone or audio input
- Export WebGPU shader code for drop-in loading indicators
Features
- Library of pre-built orb presets including Siri Wave, Neural Plasma, and Crystal Drop
- Detailed glass shell controls for refraction, dispersion, rim highlights, and edge width
- Motion and color customization including edge softness and outer glow controls
- Audio-reactive modes powered by live microphone input or uploaded audio files
- AI state simulation to test idle, activation, thinking, and settle durations
- Direct code export button and GitHub repository access
Pricing
Free and open source
Details
- Type
- Web app
- Category
- Development
- Topic
- UI Components
- Open source
- Yes
- Platforms
- Web
- For
- Frontend developers and UI/UX designers building AI applications
- Tags
- webgpu, shaders, animation, ai ui, ui components
Why it was saved
- @neropursue: Customizable glowing orbs with presets, live controls and a Copy Code button — drop-in AI status animations for websites or apps.
Related
Copy-paste React UI components built with Tailwind CSS and Radix primitives.
Pre-built, responsive shadcn/ui blocks and layouts for React applications
Open-source animation library for React, Vue, and vanilla JavaScript
Open-source animated and interactive React UI components and backgrounds
Curated directory of crafted React, Tailwind, and shadcn UI components.
Open-source animated React icons built with Lucide and Motion
Updated