Command Palette

Search for a command to run...

SFX/Success SFX

Success SFX

Positive completion chime for deploys and achievements. CC0 license.

Open in v0Open in
success
2.54s|ui

Overview

A bright, positive glockenspiel chime for deploy completions, test passes, and achievement moments. Duration: 2.54s.

Installation

React / Web Audio

npx shadcn@latest add @elements/sfx-success

Video Production / Agents

curl -o public/sfx/success.mp3 https://tryelements.dev/sfx/success.mp3

Usage

React Hook

import { useSound } from "@/hooks/use-sound";
import { successSound } from "@/sfx/success";

export function DeployButton() {
  const [play] = useSound(successSound, { volume: 0.4 });

  const handleDeploy = async () => {
    await deploy();
    play();
  };

  return <button onClick={handleDeploy}>Deploy</button>;
}

Remotion

import { Audio, staticFile } from "remotion";

export function DeploySuccess() {
  return <Audio src={staticFile("sfx/success.mp3")} volume={0.35} />;
}

Timing

Play at 0ms when the success state appears. Pairs well after a riser buildup.

License

CC0 (public domain). No attribution required. Free for commercial use.