ActiveAnimated components239
@audiocn
Animated components · data updated 2026-10-10
Audio components for React, built the shadcn way. Level meters, visualizers, faders, knobs, channel strips, a complete mixer, players and sound pads.
animationaudiobuttonscardsformshooksoverlays
Install
npx shadcn@latest add https://www.audiocn.dev/r/registry.jsonHealth
StatusActive
Last commit1 day ago
License—
Open issues8
ArchivedNo
Stars239
Components (49)
coreuse-frame-sourceuse-leveluse-clip-holduse-reduced-motionuse-visibilityuse-demo-signaluse-audio-contextuse-gain-nodeuse-audio-analyseruse-audio-devicesuse-microphoneuse-system-audiouse-audio-configdb-scaledb-readoutclip-indicatorlevel-meterbar-visualizerelectricelectric-bar-visualizerelectric-waveformsmooth-waveformlive-waveformfaderparameter-sliderknobpan-controlchannel-togglevolume-controlaudio-device-selectuse-mixeruse-web-audio-mixerchannel-stripmixeruse-audio-playeruse-sounduse-waveform-datawaveformaudio-playertrack-listsound-padspectrumsystem-audio-mixermic-setupsystem-audio-settingsquick-audio-popoversoundboardmusic-player
Components: core, use-frame-source, use-level, use-clip-hold, use-reduced-motion, use-visibility, use-demo-signal, use-audio-context, use-gain-node, use-audio-analyser, use-audio-devices, use-microphone, use-system-audio, use-audio-config, db-scale, db-readout, clip-indicator, level-meter, bar-visualizer, electric, electric-bar-visualizer, electric-waveform, smooth-waveform, live-waveform, fader, parameter-slider, knob, pan-control, channel-toggle, volume-control, audio-device-select, use-mixer, use-web-audio-mixer, channel-strip, mixer, use-audio-player, use-sound, use-waveform-data, waveform, audio-player, track-list, sound-pad, spectrum, system-audio-mixer, mic-setup, system-audio-settings, quick-audio-popover, soundboard, music-playerPreview
Live sandbox previews render component source client-side. Where a component can’t be rendered standalone, sh4dcn falls back to its source and install command.