ui-sounds

Procedural audio feedback for UI interactions. Pure Web Audio API synthesis, zero dependencies.

Select theme

How it works

Every sound is synthesized at runtime using oscillators, filters, and gain envelopes. No audio files loaded. Each theme changes the waveforms, frequencies, and character.

Oscillator → Filter → Gain → Master → Output

Add to your project

Install the Claude Code skill, then ask Claude to add sounds.

# Add the skill to your project
git clone https://github.com/buburdin/ui-sounds .claude/skills/ui-sounds

Then prompt Claude:

"Add click sounds to all buttons using the playful theme"

Claude generates inline code — no npm install needed:

// Generated React hook
const { playClick, playSuccess } = useUISound('playful');

// Use in your components
<button onClick={() => { playClick(); }}>
  Save
</button>

Sound reference

Action	Sound	Duration
click	Short percussive tap	30–120ms
navigation	Frequency sweep / whoosh	80–450ms
success	Ascending tone	100–300ms
error	Vibrato alert	150–600ms
loading	Repeating pulse	20–200ms
hover	Subtle presence	15–45ms
delete	Descending warning	80–300ms