quiet

Sound, with a lighter touch.

Gentle, open-source UI sound effects for interfaces that feel good to use.

Use Quiet FX.

Copy the code or bring the setup to your coding assistant.

Documentation
npm install github:filipeafns/quiet-fx#v0.4.1
JavaScript
import { CUES, makePatch, renderPatch, SoundPlayer } from 'quiet-fx';

export const quietCueId = "sparkle";
export const quietSettings = Object.freeze({
  "key": "C",
  "mode": "Major",
  "voice": "Soft",
  "variant": "Normal",
  "shape": "Natural",
  "softness": 32,
  "brightness": 45,
  "duration": 1,
  "texture": 42,
  "seed": 1
});

const cue = CUES.find(({ id }) => id === quietCueId);
if (!cue) throw new Error('Quiet FX sound not found: ' + quietCueId);
const rendered = renderPatch(makePatch(cue, quietSettings));

// Create one owner per mounted feature; create a fresh owner after remounting.
export function createQuietSound() {
  const player = new SoundPlayer();
  let generation = 0;
  let disposed = false;

  function stopQuiet() {
    generation += 1;
    player.stop();
  }

  // Call directly from an existing click/tap/key handler after checking sound preferences.
  async function playQuiet() {
    if (disposed) return false;
    stopQuiet();
    const request = generation;
    try {
      const enabled = await player.enable();
      if (!enabled || disposed || request !== generation) return false;
      return player.play(rendered, 0, false) !== null;
    } catch {
      return false;
    }
  }

  async function disposeQuiet() {
    if (disposed) return;
    disposed = true;
    stopQuiet();
    const context = player.context;
    if (context && context.state !== 'closed') {
      await context.close().catch(() => {});
    }
  }

  return { play: playQuiet, stop: stopQuiet, dispose: disposeQuiet };
}