design-infraReport a problem or share feedback← Catalog
Voice Pill
freereact-bits/voice-pill
Mic button that swells into a tinted capsule of level-driven equalizer bars and an elapsed clock while held or toggled, then relaxes back into the mic on release; simulated voice by default, real microphone as an opt-in.
$
npx shadcn@latest add @react-bits/VoicePill-TS-TWnpm deps: @hugeicons/react, @hugeicons/core-free-icons
- Source
- React Bits
- Kind
- component
- Categories
- badge
- Use as
- drop-in — replaces your component
- Applies to
- badge
- Motion
- on loop · medium · canvas · high cost · respects reduced motion
- Tags
- micro
- Licence
- MIT + Commons Clause: free to use in commercial apps/sites, but you may not sell or redistribute the components themselves (alone, bundled, or ported). React Bits Pro is a separate paid product.
- Live demo
- www.reactbits.dev
- Docs
- www.reactbits.dev
Similar
Compare all 4 →- Animated Badgebeui/animated-badgeStatus badge with animated state icons, pulse feedback and compact size variants.
- Call Chipreact-bits/call-chipInline tool-call chip whose fill wipes across while a live ms counter ticks, completing with a green wash on success or stopping short and shaking red with a retry glyph on error.
- Pill Navreact-bits/pill-navMinimal pill nav with sliding active highlight + smooth easing.