xiry.

Development · Web app

cuelume

Synthesized Web Audio interaction sound library with zero audio files.

From the Xiry library · Updated 14 October 2026

Visit cuelume.dev ↗

cuelume is a lightweight, zero-dependency JavaScript library that generates fourteen distinct UI interaction sounds entirely via Web Audio API. Instead of loading sound files, it synthesizes audio on the fly and can be attached declaratively to HTML elements using simple data attributes. It dynamically adapts pitch and envelope based on user context like input type, directional movement, and action emphasis.

What it's for

  • Add tactile audio feedback to web buttons, switches, and form inputs
  • Provide acoustic signals for loading, success, and error application states
  • Create dynamic micro-interactions that adjust sound subtly based on input modality

Features

  • 14 synthesized audio cues covering taps, typing, toggles, loading, and alerts
  • Zero audio assets loaded over the network
  • Declarative binding using HTML data attributes like data-cuelume-tap
  • Dynamic modulation based on direction and input method (pen, mouse, touch)
  • Four sound presets: Default, Mech, Bubble, and Press
  • Emphasis levels to scale sound complexity to action importance
  • Tiny footprint around 9 kB minified and gzipped

Pricing

Open source. Free (MIT License)

Details

Type
Web app
Category
Development
Topic
UI Audio
Open source
Yes
Platforms
Web, Code library
For
Front-end developers and UI/UX design engineers
Alternative to
use-sound, Howler.js
Tags
web audio, javascript, micro interactions, sound design, ui components

Why it was saved

  • @dwhitedesign, 13 October 2026: Drop-in UI sound layer; each behavior is triggered by a single data attribute, and cue presets let a product change its sonic feel without touching the implementation.

Related

  • Spell UI

    Refined, copy-paste React and Tailwind CSS components with micro-interactions

  • Amicro

    Micro-interaction and transition UI component library built with React and Motion

  • Cuelume

    Synthesized Web Audio interaction sound library with zero audio files.

  • Eight Dev Tools, Zero Fluff — Part 6

    Curated list of eight front-end design and developer utility tools

  • React Native Paper

    Open-source Material Design component library for React Native apps

  • Sona UI — FluidTooltip

    Animated tooltip component that glides smoothly across interactive elements

Updated