HTMLエンティティ変換ツール｜特殊文字 <> & " ' → 実体参照

< > & " などの特殊文字や、改行・タブを、HTMLの実体参照（エンティティ）に一括変換するツール。HTMLメールのalt属性やコード表示等のエスケープに。

このツールは、テキスト中の特殊文字を HTMLの実体参照（文字参照・エンティティ） に変換するオンラインツールです。左側のテキストエリアに文字列を入力し、変換したい記号のオプションにチェックを入れて「変換 »」を押すと、右側にエスケープ済みのテキストが出力され、自動でクリップボードにコピーされます。インストール不要・ブラウザ内で完結し、入力内容がサーバーに送信されることはありません。

💡 実体参照とは・なぜ必要か

HTMLでは < や & などの記号が特別な意味を持ちます。たとえば <div> はそのまま書くと「タグ」として解釈され、画面には表示されません。これを文字として扱わせたいときに、<div> のような実体参照に置き換えます。同様に、属性値の中で使う "（ダブルクォート）や、HTMLメールで必要になる改行 
 なども、実体参照にしておくことで崩れを防げます。

⚙️ 変換オプション

オプション	説明・使いどころ
`&` を → `&`	実体参照の起点になる文字。他のエスケープより先に変換する必要があるため、原則いちばん最初に適用されます（二重エスケープ防止）。
`< >` を → `< >`	もっとも基本のエスケープ。タグとして解釈させず、`<div>` などを文字としてそのまま表示させたいときに。
`"` を → `"`	ダブルクォート。属性値の中に別の属性値を入れるとき（コピー用コード片など）に必須。`data-copy=' style="…"'` のように、外側のクォートと衝突させないために使います。
`'` を → `'`	シングルクォート。属性を `'…'` で囲っている場合の衝突回避に。
`[ ]` を → `[ ]`	角括弧。WordPressのショートコード（`[amazon]` 等）として解釈されるのを防ぎたいときに。
`( )` を → `( )`	丸括弧。テンプレートエンジンや記法との衝突を避けたいときに。
`{ }` を → `{ }`	波括弧。`{{ }}` 系のテンプレート記法やCSS/JSブロックを、文字として見せたいときに。
` を → `&grave;`	バッククォート。Markdownのコード記法として解釈されるのを防ぎたいときに。
改行を → ` `	改行を CR+LF の数値参照に変換。HTMLメールの alt 属性など、属性値の中で改行を表現したいときに使います。
タブを → ` `	タブ文字を数値参照に変換します。
すべてのHTMLタグを除去	入力からタグ（`<…>`）だけを取り除きます。テキストだけを抜き出したいときに。
改行の削除・整理	「全ての改行を削除」「単一改行を削除し連続改行を1つ減らす」で、1行にまとめたり余分な空行を整理できます。属性値に流し込む前の下ごしらえに便利です。

※ 複数のエスケープを同時にかける場合、& の変換が最初に適用されます。これにより < が &lt; のように二重エスケープされる事故を防いでいます。

🎯 活用例

シーン	使い方
コピー用のコード片（data-copy 等）	「コピーボタン」に持たせる文字列に、HTML属性を含むコードを入れるケース。`data-copy='…'` の中に `style="…"` を入れると、内側の `"` をエスケープしないとクォートが衝突して壊れます。`"` を `"` に変換しておけば、そのまま安全にコピーできます。
HTMLメールの alt 属性・属性値	HTMLメールは記法が厳格で、実体参照が必要な場面が多い形式です。`alt` 内の改行は ` `、ダブルクォートは `"` に変換しておくと、メーラーをまたいで崩れにくくなります。
ブログ・技術記事にコードを載せる	`<` を `<` にエスケープすることで、HTMLタグをタグとして解釈させず、コード例としてそのまま表示できます。
WordPressのショートコード無効化	`[…]` を `[…]` に変換して、ショートコードとして実行されるのを防ぎ、記法そのものを見せたいときに。