How do I install the Sfx Elements skill?

Run npx skillmds@latest add crafter-station/sfx-elements in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Sfx Elements safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Sfx Elements?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Sfx Elements free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Sfx Elements?

crafter-station (@crafter-station) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Sfx Elements by crafter-station — Agent Skill

Name: Sfx Elements
Author: crafter-station

Sfx Elements

Install CC0 sound effects from the Elements registry. Use when user needs UI sounds (click, pop, notification), transition sounds (whoosh, swoosh), cinematic sounds (boom, riser, glitch), or audio for video production. Triggers on "sound effect", "SFX", "audio", "notification sound", "click sound", "whoosh", "UI sound", "sound for video", "play sound", "useSound".

File contents

SFX Elements

17 CC0 sound effects. Dual format: TypeScript modules for React + raw MP3 for video/agents.

Install (React / Web Audio)

npx shadcn@latest add @elements/sfx-{name}

Installs the sound as a TypeScript module with inline base64 audio, plus useSound hook and sound engine.

Install as raw MP3 (Video / Agents / CLI)

No React needed. Download the MP3 directly:

curl -o {name}.mp3 https://tryelements.dev/sfx/{name}.mp3

Works with ffmpeg, video editors, Python scripts, or any tool that plays audio files. All sounds served with audio/mpeg content-type.

Sounds

Transitions (6)

Sound	Duration	Install
Whoosh	0.57s	`@elements/sfx-whoosh`
Whoosh Alt 1	1.10s	`@elements/sfx-whoosh-alt1`
Whoosh Alt 2	1.56s	`@elements/sfx-whoosh-alt2`
Magic Reveal	2.04s	`@elements/sfx-magic-reveal`
Reverse Whoosh	5.85s	`@elements/sfx-reverse-whoosh`
Swoosh	4.08s	`@elements/sfx-swoosh`

UI (6)

Sound	Duration	Install
Click	1.03s	`@elements/sfx-click`
Pop	1.02s	`@elements/sfx-pop`
Keyboard	8.05s	`@elements/sfx-keyboard`
Notification	2.12s	`@elements/sfx-notification`
Error	0.53s	`@elements/sfx-error`
Success	2.54s	`@elements/sfx-success`

Cinematic (5)

Sound	Duration	Install
Riser	4.03s	`@elements/sfx-riser`
Shutter	7.87s	`@elements/sfx-shutter`
Glitch	2.64s	`@elements/sfx-glitch`
Boom	4.30s	`@elements/sfx-boom`
Drone	6.82s	`@elements/sfx-drone`

Bundles

Need	Command
All 17 sounds	`@elements/sfx-all`
Transitions	`@elements/sfx-transitions`
UI sounds	`@elements/sfx-ui`
Cinematic	`@elements/sfx-cinematic`

Usage

import { useSound } from "@/hooks/use-sound";
import { whooshSound } from "@/components/sfx/whoosh";

export function TransitionButton() {
  const { play } = useSound(whooshSound, { volume: 0.5 });
  return <button => play()}>Transition</button>;
}

Timing Guidelines

Event	Sound	When
Text appears	pop, click	exact frame
Scene transition	whoosh, swoosh	100ms before cut
Fast cut	swoosh	50ms before cut
Dramatic reveal	magic-reveal, boom	50ms before
Error state	error, glitch	at reveal
Success/deploy	success	at reveal
Build tension	drone, riser	start of section

Discover All Sounds

curl -s https://tryelements.dev/r/sfx-index.json | jq '.sounds[].name'

Discovery

Browse https://tryelements.dev/docs/sfx

License

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

---name: sfx-elementsdescription: Install CC0 sound effects from the Elements registry. Use when user needs UI sounds (click, pop, notification), transition sounds (whoosh, swoosh), cinematic sounds (boom, riser, glitch), or audio for video production. Triggers on "sound effect", "SFX", "audio", "notification sound", "click sound", "whoosh", "UI sound", "sound for video", "play sound", "useSound".---# SFX Elements17 CC0 sound effects. Dual format: TypeScript modules for React + raw MP3 for video/agents.## Install (React / Web Audio)```bashnpx shadcn@latest add @elements/sfx-{name}```Installs the sound as a TypeScript module with inline base64 audio, plus `useSound` hook and sound engine.## Install as raw MP3 (Video / Agents / CLI)No React needed. Download the MP3 directly:```bashcurl -o {name}.mp3 https://tryelements.dev/sfx/{name}.mp3```Works with ffmpeg, video editors, Python scripts, or any tool that plays audio files. All sounds served with `audio/mpeg` content-type.## Sounds### Transitions (6)| Sound | Duration | Install ||-------|----------|---------|| Whoosh | 0.57s | `@elements/sfx-whoosh` || Whoosh Alt 1 | 1.10s | `@elements/sfx-whoosh-alt1` || Whoosh Alt 2 | 1.56s | `@elements/sfx-whoosh-alt2` || Magic Reveal | 2.04s | `@elements/sfx-magic-reveal` || Reverse Whoosh | 5.85s | `@elements/sfx-reverse-whoosh` || Swoosh | 4.08s | `@elements/sfx-swoosh` |### UI (6)| Sound | Duration | Install ||-------|----------|---------|| Click | 1.03s | `@elements/sfx-click` || Pop | 1.02s | `@elements/sfx-pop` || Keyboard | 8.05s | `@elements/sfx-keyboard` || Notification | 2.12s | `@elements/sfx-notification` || Error | 0.53s | `@elements/sfx-error` || Success | 2.54s | `@elements/sfx-success` |### Cinematic (5)| Sound | Duration | Install ||-------|----------|---------|| Riser | 4.03s | `@elements/sfx-riser` || Shutter | 7.87s | `@elements/sfx-shutter` || Glitch | 2.64s | `@elements/sfx-glitch` || Boom | 4.30s | `@elements/sfx-boom` || Drone | 6.82s | `@elements/sfx-drone` |## Bundles| Need | Command ||------|---------|| All 17 sounds | `@elements/sfx-all` || Transitions | `@elements/sfx-transitions` || UI sounds | `@elements/sfx-ui` || Cinematic | `@elements/sfx-cinematic` |## Usage```tsximport { useSound } from "@/hooks/use-sound";import { whooshSound } from "@/components/sfx/whoosh";export function TransitionButton() { const { play } = useSound(whooshSound, { volume: 0.5 }); return <button onClick={() => play()}>Transition</button>;}```## Timing Guidelines| Event | Sound | When ||-------|-------|------|| Text appears | pop, click | exact frame || Scene transition | whoosh, swoosh | 100ms before cut || Fast cut | swoosh | 50ms before cut || Dramatic reveal | magic-reveal, boom | 50ms before || Error state | error, glitch | at reveal || Success/deploy | success | at reveal || Build tension | drone, riser | start of section |## Discover All Sounds```bashcurl -s https://tryelements.dev/r/sfx-index.json | jq '.sounds[].name'```## DiscoveryBrowse https://tryelements.dev/docs/sfx## LicenseAll sounds are CC0 (public domain). No attribution required. Free for commercial use.

Frequently asked questions