HTMLエンティティ変換ツール(無料・登録不要)
HTMLエンティティのエスケープ・アンエスケープをリアルタイム変換。名前参照(&lt;)・10進数値(&#60;)・16進数値(&#x3C;)3形式対応。< > & " ' などの特殊文字変換、よく使うエンティティ一覧表50種付き。XSS対策解説も。完全無料・登録不要・ブラウザ完結。
最終更新:2026年5月14日
使い方ガイド:こんな場面で役立ちます
技術記事にHTMLコードをそのまま貼り付けると、ブラウザがタグとして解釈してレンダリングされてしまいます。エスケープ変換を使うと <div> を文字としてそのまま表示できます。
ユーザーが入力したテキストをHTMLに出力する前に必ずエスケープが必要です。<script> などのタグを無効化し、クロスサイトスクリプティング(XSS)を防ぎます。
HTMLメールでは特殊文字のエスケープが重要です。メールクライアントによってエンコード処理が異なるため、すべての特殊文字をエンティティ化することで表示崩れを防げます。
WordPressなどのCMSやREST APIが返すJSONに & < などのエスケープ済みHTMLが含まれることがあります。アンエスケープで元の文字に戻して処理できます。
主な変換例
| 元の文字 | 名前参照 | 10進数値 | 16進数値 | 用途 |
|---|---|---|---|---|
< | < | < | < | タグの開始。必須エスケープ |
> | > | > | > | タグの終了。必須エスケープ |
& | & | & | & | エンティティの開始。必須エスケープ |
" | " | " | " | 属性値の囲み。必須エスケープ |
' | ' | ' | ' | 属性値の囲み。HTML5で追加 |
よく使うHTMLエンティティ一覧(50種)
Web制作でよく使うHTMLエンティティをカテゴリ別にまとめました。クリックでコピーできます。
必須エスケープ文字(5種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
< | < | < | 小なり記号 / タグ開始 |
> | > | > | 大なり記号 / タグ終了 |
& | & | & | アンパサンド |
" | " | " | ダブルクォーテーション |
' | ' | ' | シングルクォーテーション |
スペース・改行(3種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
| [空白] | |   | ノーブレークスペース(改行しない空白) |
| [細空白] |   |   | 半角スペース(emの半分) |
| [広空白] |   |   | 全角スペース(1em分) |
記号・数学(15種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
| © | © | © | 著作権記号 © |
| ® | ® | ® | 登録商標記号 ® |
| ™ | ™ | ™ | 商標記号 ™ |
| € | € | € | ユーロ記号 € |
| ¥ | ¥ | ¥ | 円記号 ¥ |
| £ | £ | £ | ポンド記号 £ |
| ¢ | ¢ | ¢ | セント記号 ¢ |
| ± | ± | ± | プラスマイナス ± |
| × | × | × | 乗算記号 × |
| ÷ | ÷ | ÷ | 除算記号 ÷ |
| ≠ | ≠ | ≠ | 不等号 ≠ |
| ≤ | ≤ | ≤ | 以下 ≤ |
| ≥ | ≥ | ≥ | 以上 ≥ |
| ∞ | ∞ | ∞ | 無限大 ∞ |
| ° | ° | ° | 度記号 ° |
矢印(8種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
| ← | ← | ← | 左矢印 ← |
| → | → | → | 右矢印 → |
| ↑ | ↑ | ↑ | 上矢印 ↑ |
| ↓ | ↓ | ↓ | 下矢印 ↓ |
| ↔ | ↔ | ↔ | 左右矢印 ↔ |
| ⇐ | ⇐ | ⇐ | 二重左矢印 ⇐ |
| ⇒ | ⇒ | ⇒ | 二重右矢印 ⇒ |
| ⇔ | ⇔ | ⇔ | 二重左右矢印 ⇔ |
引用符・括弧・句読点(10種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
| « | « | « | 二重山括弧(左)« |
| » | » | » | 二重山括弧(右)» |
| ‘ | ‘ | ‘ | 左シングル引用符 ' |
| ’ | ’ | ’ | 右シングル引用符 ' |
| “ | “ | “ | 左ダブル引用符 " |
| ” | ” | ” | 右ダブル引用符 " |
| · | · | · | 中点 · |
| • | • | • | 箇条書き記号 • |
| … | … | … | 省略記号 … |
| — | — | — | emダッシュ — |
ギリシャ文字(9種)
| 文字 | 名前参照 | 10進数値 | 説明 |
|---|---|---|---|
| α | α | α | α(アルファ) |
| β | β | β | β(ベータ) |
| γ | γ | γ | γ(ガンマ) |
| δ | δ | δ | δ(デルタ) |
| π | π | π | π(パイ) |
| σ | σ | σ | σ(シグマ) |
| μ | μ | μ | μ(ミュー) |
| ω | ω | ω | ω(オメガ) |
| Ω | Ω | Ω | Ω(オメガ大文字) |
XSS(クロスサイトスクリプティング)対策とHTMLエスケープ
XSSとは何か
クロスサイトスクリプティング(XSS)は、Webアプリケーションの脆弱性を利用して、悪意のあるスクリプトを他のユーザーのブラウザ上で実行させる攻撃手法です。OWASPのトップ10に毎年ランクインする、最も一般的なWebセキュリティの脅威の一つです。
// ユーザー入力をそのまま出力(XSS脆弱性あり)
innerHTML = userInput;
// ↑ userInputが "<script>alert('XSS')</script>" の場合
// スクリプトが実行される
// ユーザー入力をエスケープしてから出力(安全)
function escapeHTML(str) {
return str
.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''');
}
textContent = escapeHTML(userInput);
エスケープが必要な場面
ユーザー入力をHTMLの本文として出力する前に
< > & " ' の5文字をエスケープします
href="" や value="" などの属性値にユーザー入力を使う場合、属性全体をダブルクォートで囲み内容をエスケープ
React・Vue・Angular等のフレームワークは
{変数} で自動エスケープします。dangerouslySetInnerHTML や v-html は信頼できるデータにのみ使用してください
名前参照と数値参照(数値文字参照)の違い・使い分け
参照形式の種類
HTMLエンティティには3つの表記形式があります。どれも同じ文字を表示しますが、用途・可読性・対応範囲が異なります。
< & ©
- 人間が読みやすい(可読性が高い)
- コードレビューでも意味が分かりやすい
- HTMLで定義されている文字のみ使用可能
- HTMLの5種の必須文字・一般的な記号に最適
< & ©
- すべてのUnicode文字に対応
- 名前参照が存在しない文字も表現できる
- プログラムで生成しやすい(文字コードを10進数化)
- 一部の古いメールクライアントで安定して表示される
< & ©
- すべてのUnicode文字に対応
- Unicodeコードポイント(U+003Cなど)と直接対応
- 開発者ドキュメント・仕様書との照合が容易
- CSSの content プロパティと同じ形式
よくある質問(FAQ)
- HTMLエンティティとは何ですか?
- HTMLエンティティ(HTML実体参照)とは、HTMLで特別な意味を持つ文字や、キーボードから直接入力できない文字を表現するための特殊記法です。「&」で始まり「;」で終わる名前参照(< → <)か、「&#」で始まる数値参照(< → <)形式で記述します。
- HTMLエスケープが必要な文字はどれですか?
- HTMLで必ずエスケープが必要な文字は5種類です。「<」(タグの開始)→ <、「>」(タグの終了)→ >、「&」(エンティティの開始)→ &、「"」(属性値の囲み)→ "、「'」(属性値の囲み)→ ' です。これ以外の特殊文字は必須ではありませんが、文字コード問題を防ぐためにエンティティ化することもあります。
- XSS対策にHTMLエスケープは有効ですか?
- はい。クロスサイトスクリプティング(XSS)の主な対策はユーザー入力のHTMLエスケープです。ユーザーから受け取ったテキストをそのままHTMLに出力すると、悪意のある<script>タグが実行される危険があります。出力前に必ずエスケープ処理(< → <、> → > 等)することで、スクリプトがコードとして解釈されず文字として表示されます。
- 名前参照と数値参照(数値文字参照)の違いは何ですか?
- 名前参照は < や © のように人間が読みやすい名前形式です。数値参照は <(10進数)や <(16進数)のようにUnicodeコードポイントで表します。名前参照はHTMLで定義されたもののみ使用可能ですが、数値参照はすべてのUnicode文字に対応しています。ほとんどの場面で名前参照のほうが可読性が高く推奨されます。
- (ノーブレークスペース)はどんな場合に使いますか?
- (Non-Breaking Space: ノーブレークスペース)は、改行させたくない箇所に使うスペースです。通常のスペースと違い、このスペースの前後では自動改行が発生しません。「1,000 円」「Mr. Smith」など、単位や敬称の前で改行させたくない場合や、強制的に空白を入れたい場合(HTMLは通常複数スペースを1つに圧縮するため)に使います。
- このツールでデータはサーバーに送信されますか?
- いいえ。このHTMLエンティティ変換ツールはブラウザ内のJavaScriptのみで動作します。入力したHTMLコードやテキストはサーバーに一切送信されません。機密情報を含むHTMLコードや社内システムのテンプレートも安心してお使いいただけます。
- HTMLエンティティのアンエスケープはどんな場面で使いますか?
- アンエスケープ(エンティティ→テキスト)は、HTMLソースコードやCMSから取得したエンティティ形式のテキストを元の文字に戻す際に使います。例えばAPIレスポンスに <div> のようなエスケープ済みHTMLが含まれていて、実際のHTMLとして扱いたい場合や、スクレイピングで取得したHTMLから生テキストを抽出したい場合などに便利です。
- W3Cの名前付き文字参照(HTMLエンティティ)の一覧はどこにありますか?
- W3C HTML Living Standard(https://html.spec.whatwg.org/multipage/named-characters.html)に2,231個の名前付き文字参照の全一覧が公開されています。MDN Web Docs(https://developer.mozilla.org/ja/docs/Glossary/Entity)でも代表的なエンティティを確認できます。
- HTMLエンティティとHTMLエスケープは同じ意味ですか?
- 似ていますが厳密には異なります。HTMLエンティティは < や © のような特殊文字の表記形式そのものを指します。HTMLエスケープは、テキスト中の特殊文字をHTMLエンティティに変換するプロセスを指します。「エスケープする」とは「特殊文字をエンティティ形式に変換する」ことを意味します。
- を複数連続で使うのは良くないですか?
- の複数連続使用はアクセシビリティ上の問題があります。スクリーンリーダーが「ノーブレークスペース」として読み上げる場合があります。レイアウト目的のスペース挿入には、CSSの
padding・margin・letter-spacingを使うことを推奨します。 は「ここで改行させたくない」という意味論的な目的で使ってください。 - HTMLエスケープと URLエンコードは何が違いますか?
- 対象と目的が異なります。HTMLエスケープはHTMLドキュメント内で特殊文字を安全に表示するための変換(< → <)です。URLエンコード(パーセントエンコーディング)はURLに使用できない文字を %XX 形式に変換することです(スペース → %20、日本語 → %E6% など)。用途が異なるため、間違えないようにしてください。