# cuelume

> Synthesized Web Audio interaction sound library with zero audio files.

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.

Website: https://cuelume.dev/

## What it is 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](https://xiry.app/topics/development.md)
- 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](https://x.com/dwhitedesign/status/2109998865072193868): 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](https://xiry.app/resources/spell-ui): Refined, copy-paste React and Tailwind CSS components with micro-interactions (GitHub repo, Open source)
- [Amicro](https://xiry.app/resources/amicro): Micro-interaction and transition UI component library built with React and Motion (Web app)
- [Cuelume](https://xiry.app/resources/cuelume): Synthesized Web Audio interaction sound library with zero audio files. (Web app, Open source)
- [Eight Dev Tools, Zero Fluff — Part 6](https://xiry.app/resources/eight-dev-tools-zero-fluff-part-6): Curated list of eight front-end design and developer utility tools (List)
- [React Native Paper](https://xiry.app/resources/react-native-paper): Open-source Material Design component library for React Native apps (Website, Open source)
- [Sona UI — FluidTooltip](https://xiry.app/resources/sona-ui-fluidtooltip): Animated tooltip component that glides smoothly across interactive elements (Web app, Free)

Updated 14 October 2026. Page: https://xiry.app/resources/cuelume-3005

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.
