Skip to content
Index730 resources
Cuelume

Cuelume

17 synthesized UI sounds via Web Audio, zero runtime deps

Tier B · UsefulAsset PackToolcuelume-site.pages.dev

(Visit cuelume-site.pages.dev ↗)(Repository)
Preview image from cuelume-site.pages.dev

Cuelume is a small ESM library that gives buttons, links, toggles and completed actions audible feedback. It synthesizes 17 named cues live with the Web Audio API — chime, sparkle, droplet, bloom, whisper, tick, press, release, toggle, success, error, page, loading, ready, pulse, scan, arrival — so there are no audio files to load and no runtime dependencies. You mark up elements with data-cuelume-hover / -press / -release / -toggle and call bind() once; play(), setEnabled() and setVolume() cover the imperative cases. Framework-agnostic and MIT licensed.

Install
npm install cuelume

For an agent

Use Cuelume when the user wants interaction sound and you do not want to ship or license audio assets — everything is synthesized at play time, so bundle cost is near zero and there is no CDN fetch. The attribute-plus-bind() pattern means you can add it to an existing React/Vue tree without touching component code, which makes it a better fit than Howler or Tone.js for pure UI feedback. Watch three things: it is ESM-only so CommonJS require() will fail; browsers block audio until a user gesture, so call bind() and let the first real click unlock the context rather than autoplaying; and always give the user a mute control, because unrequested sound is an accessibility problem. Note the marketing site at cuelume-site.pages.dev did not respond during verification — send users to the GitHub repo or npm instead.

Why it is here. Interaction audio is the one sensory layer almost every web design system skips, and the usual reason is asset management; Cuelume removes that excuse by synthesizing a coherent 17-cue palette in a few kilobytes.

Install command, framework, licence and component list.

Facts

License
MIT
Pricing
Free, Open source
Framework
Vanilla JS
Styling
Not applicable
Distribution
npm package, GitHub repository
Platform
Web
Content type
Audio, Code
Agent readiness
Readable open source
Accessibility
Unknown
Maturity
Beta
GitHub stars
1,356
Package
cuelume

Helps you build

4
Submitting A FormSaving ChangesNotificationsShowing Input Error

Notable for

  • 17 named cues, all synthesized live
  • zero runtime dependencies
  • data-attribute binding, framework-agnostic
  • ESM-only
  • listed URL was unreachable at verification

Provenance

Verified 2026-08-15. https://cuelume-site.pages.dev/ FAILED — three WebFetch attempts timed out and curl returned 000 after 25s while github.com and ui.unlumen.com returned 200 from the same shell, so the host is genuinely unreachable, not a local network fault. Verified instead via https://github.com/Danilaa1/cuelume (README: 17 cue names, API, data attributes, ESM-only), GitHub API repos/Danilaa1/cuelume (stars 1356, MIT, pushed_at 2026-08-04), and https://www.npmjs.com/package/cuelume (v0.1.2; page itself 403'd to WebFetch, version read from search result).

Also in Motion & Interaction

6
cuelume-site.pages.devTier B