音声波形画像生成

音声ファイルをブラウザ内で解析し、色と寸法を指定した波形画像を生成します。

音声を選択

幅高さ波形色背景色

Guide

このツールでできること

MP3、WAVなどブラウザがデコードできる音声ファイルから、時間方向の振幅を表す波形PNGを作成できます。Podcastのカバー素材、動画内の音声表現、編集前の無音区間確認に利用できます。

画像の幅・高さ、波形色、背景色を指定できるため、横長の動画素材や正方形に近いSNS素材など、掲載場所に合わせた寸法で書き出せます。

How it works

処理の仕組み

Web Audio APIのdecodeAudioDataで端末内の音声をAudioBufferへ変換し、先頭チャンネルのサンプルを画像幅ごとの区間へ分割します。各区間の最小振幅と最大振幅をCanvas上の縦線として描き、完成したCanvasをPNG Blobへ変換します。

Examples

具体的な使用例

Podcast用の横長波形

入力: 30秒の音声、1200×360px、波形#087f8c、背景#ffffff
結果: 30秒全体を横方向へ縮約した1200×360pxのPNG

画像の各列が音声の一定区間を表し、その区間内の音量変化を上下の振幅として確認できます。

暗い背景の動画素材

入力: 波形を白、背景を濃紺に変更
結果: 動画編集ソフトへ配置しやすい配色の波形画像

再解析せずに色と寸法を変更して描き直せるため、複数デザイン案を比較できます。

Cautions

利用時の注意点

ブラウザがデコードできないコーデックや破損した音声は解析できません。拡張子だけでなく実際の音声形式も影響します。
現在は先頭チャンネルを描画するため、左右チャンネルが大きく異なるステレオ音声では全体像と差が出る場合があります。
波形画像は音声の内容や権利を確認するものではありません。公開時は音源の利用許諾を確認してください。

Next step

結果の活用方法

無音に近い区間と大きなピークを目視し、動画のカット位置や音量調整候補を探す補助資料として使えます。
最終掲載サイズより2倍程度の寸法で出力して縮小すると、高密度ディスプレイでも線を保ちやすくなります。

更新日：2026.07.28

PitaTools

特徴

音声解析
色・寸法設定
PNG保存

Steps

使い方

音声を選択します。
表示を調整します。
波形PNGを保存します。

PitaTools

活用例

Podcast画像
動画編集素材
音声確認

Example

入力例・結果例

入力例: 加工したい画像、色、サイズなどの設定
結果例: 音声解析

ファイルや複数項目を使うツールでは、安全のためサンプルを自動選択せず利用イメージのみ表示します。

Privacy

プライバシーとデータ処理

公開中のツールはブラウザ完結です。入力した文章、URL、画像、PDF、ファイル、パスワードをPitaToolsのサーバーへ送信せず、端末内で処理します。

FAQ

よくある質問

音声を送信しますか？

いいえ。Web Audio APIで端末内解析します。

Explore · 画像・デザイン

不具合報告・改善要望

「音声波形画像生成」についてお気づきの点を運営者へお知らせください。

報告・要望を送る