sfx-elements

SFX Elements

CC0 効果音 17 種類。デュアル形式：React 用 TypeScript モジュールと、動画／エージェント用の生 MP3。

インストール（React／Web Audio）

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

サウンドをインラインの Base64 音声付き TypeScript モジュールとしてインストールします。useSound フックとサウンドエンジンも含まれます。

生 MP3 としてインストール（動画／エージェント／CLI）

React は不要です。MP3 を直接ダウンロードします。

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

ffmpeg、動画編集ソフト、Python スクリプト、または音声ファイルを再生できるあらゆるツールで使用できます。すべてのサウンドは audio/mpeg のコンテンツタイプで配信されます。

サウンド

トランジション（6）

サウンド	長さ	インストール
ヒュー音	0.57s	@elements/sfx-whoosh
ヒュー音 その 1	1.10s	@elements/sfx-whoosh-alt1
ヒュー音 その 2	1.56s	@elements/sfx-whoosh-alt2
魔法の演出	2.04s	@elements/sfx-magic-reveal
逆再生ヒュー音	5.85s	@elements/sfx-reverse-whoosh
シュッという音	4.08s	@elements/sfx-swoosh

UI（6）

サウンド	長さ	インストール
クリック	1.03s	@elements/sfx-click
ポップ	1.02s	@elements/sfx-pop
キーボード	8.05s	@elements/sfx-keyboard
通知	2.12s	@elements/sfx-notification
エラー	0.53s	@elements/sfx-error
成功	2.54s	@elements/sfx-success

シネマティック（5）

サウンド	長さ	インストール
ライザー	4.03s	@elements/sfx-riser
シャッター	7.87s	@elements/sfx-shutter
グリッチ	2.64s	@elements/sfx-glitch
轟音	4.30s	@elements/sfx-boom
ドローン	6.82s	@elements/sfx-drone

バンドル

用途	コマンド
サウンド全 17 種類	@elements/sfx-all
トランジション	@elements/sfx-transitions
UI サウンド	@elements/sfx-ui
シネマティック	@elements/sfx-cinematic

使用方法

import { 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>;
}

タイミングのガイドライン

イベント	サウンド	タイミング
テキストの表示	pop, click	正確なフレーム
シーンのトランジション	whoosh, swoosh	カットの 100ms 前
高速カット	swoosh	カットの 50ms 前
劇的な演出	magic-reveal, boom	50ms 前
エラー状態	error, glitch	表示時
成功／デプロイ	success	表示時
緊張感を高める	drone, riser	セクションの開始時

すべてのサウンドを見つける

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

詳細

https://tryelements.dev/docs/sfx をご覧ください。

ライセンス

すべてのサウンドは CC0（パブリックドメイン）です。クレジット表記は不要です。商用利用も無料です。