人気絵文字 Unicode の特殊文字コード
login_user目次
- 1 人気絵文字（Emoji）の特殊文字コード一覧
- 1.1 工具・作業
- 1.2 書く・メモ
- 1.3 写真・映像
- 1.4 通信
- 1.5 コンピュータ・機器
- 1.6 家具・生活
- 1.7 スポーツ
- 1.8 乗り物・交通
- 1.9 宇宙
- 1.10 自然・季節
- 1.11 顔・表情系
- 1.12 手・ジェスチャー
- 1.13 食べ物・飲み物
- 1.14 動物・生き物
- 1.15 旗・シンボル
- 1.16 音楽・楽器
- 1.17 旅行・観光
- 1.18 天気・気象
- 1.19 恋愛・ハート
- 1.20 祝日・イベント
- 1.21 チェックなど
- 2 特殊文字コードはどれくらい重い？
- 3 2. HTMLを軽くする方法
- 3.1 UTF-8で直接書く
- 3.2 CSSで表示
- 3.3 JavaScriptで動的生成
- 3.4 画像化
- 4 3. まとめ
- 4.1 関連記事
1 人気絵文字（Emoji）の特殊文字コード一覧
ブログやWebページで使える絵文字のHTML特殊文字コードをまとめました。コピーしてすぐ使えます。
1.1 工具・作業
- 🔧 : 🔧
- 🎨 : 🎨
- 🔍 : 🔍
- 🔒 : 🔒
- 📦 : 📦
1.2 書く・メモ
- ✏️ : ✏️
- 📝 : 📝
- 📖 : 📖
- 💡 : 💡
- 📅 : 📅
1.3 写真・映像
- 📷 : 📷
- 🎥 : 🎥
- 🎬 : 🎬
1.4 通信
- 📢 : 📢
- 📣 : 📣
- 📡 : 📡
- ✉️ : ✉️
- 📩 : 📩
- 📤 : 📤
- 📥 : 📥
- 📞 : 📞
- ☎️ : ☎️
- 📟 : 📟
- 📠 : 📠
1.5 コンピュータ・機器
- 💾 : 💾
- 💿 : 💿
- 📀 : 📀
- 🖥️ : 🖥️
- 🖨️ : 🖨️
- ⌨️ : ⌨️
- 🖱️ : 🖱️
- 🖲️ : 🖲️
- 💻 : 💻
- 📱 : 📱
- 📲 : 📲
1.6 家具・生活
- 🛏️ : 🛏️
- 🛒 : 🛒
- 🚽 : 🚽
- 🚿 : 🚿
- 🛁 : 🛁
- 🛎️ : 🛎️
- 🧴 : 🧴
- 🧺 : 🧺
- 🧽 : 🧽
- 🧯 : 🧯
- 🛋️ : 🛋️
- 🚪 : 🚪
- 🪑 : 🪑
- 🛀 : 🛁
- 🧹 : 🧹
1.7 スポーツ
- ⚽ : ⚽
- 🏀 : 🏀
- 🏈 : 🏈
- ⚾ : ⚾
- 🎾 : 🎾
- 🏐 : 🏐
- 🏊 : 🏊
- 🏋️ : 🏋️
- 🚶 : 🚶
- 🏄 : 🏄
- 🏉 : 🏉
- 🏃 : 🏃
1.8 乗り物・交通
- 🚗 : 🚗
- 🚕 : 🚕
- 🚙 : 🚙
- 🚌 : 🚌
- 🚲 : 🚲
- 🚨 : 🚨
- 🛵 : 🛵
- ✈ : ✈
1.9 宇宙
- 🚀 : 🚀
- 🛰 : 🛰
- 🛸 : 🛸
1.10 自然・季節
- 🌅 : 🌅
- 🌇 : 🌇
- 🌟 : 🌟
- 🍀 : 🍀
- 🌼 : 🌼
- 🌷 : 🌷
- 🌹 : 🌹
- 🍁 : 🍁
- 🌞 : 🌞
- 🌜 : 🌜
- 🌈 : 🌈
- ☀ : ☀
- ☁ : ☁
- 🌧 : 🌧
- ⛈ : ⛈
1.11 顔・表情系
- 😀 : 😀
- 😁 : 😁
- 😂 : 😂
- 🤣 : 🤣
- 😃 : 😃
- 😄 : 😄
- 😅 : 😅
- 😆 : 😆
- 😉 : 😉
- 😊 : 😊
1.12 手・ジェスチャー
- 👋 : 👋
- 🤚 : 🤚
- ✋ : ✋
- 🖐 : 🖐
- 👍 : 👍
- 👎 : 👎
- 👌 : 👌
- ✌ : ✌
1.13 食べ物・飲み物
- 🍎 : 🍎
- 🍌 : 🍌
- 🍇 : 🍇
- 🍓 : 🍓
- 🍉 : 🍉
- 🥭 : 🥭
- 🍍 : 🍍
- 🥑 : 🥑
- 🥦 : 🥦
- 🥕 : 🥕
1.14 動物・生き物
- 🐶 : 🐶
- 🐱 : 🐱
- 🐭 : 🐭
- 🐹 : 🐹
- 🐰 : 🐰
- 🦊 : 🦊
- 🐻 : 🐻
- 🐼 : 🐼
1.15 旗・シンボル
- 🇯🇵 : 🇯🇵
- 🇺🇸 : 🇺🇸
- 🔥 : 🔥
1.16 音楽・楽器
- 🎵 : 🎵
- 🎶 : 🎶
- 🎤 : 🎤
- 🎧 : 🎧
- 🎷 : 🎷
- 🎸 : 🎸
- 🎹 : 🎹
- 🥁 : 🥁
1.17 旅行・観光
- 🏖 : 🏖
- 🏞 : 🏞
- 🗼 : 🗼
- 🌍 : 🌍
1.18 天気・気象
- ☂ : ☂
- ☔ : ☔
- ⛄ : ⛄
- 🌪 : 🌪
- ⭐ : ⭐
- ⚡ : ⚡
1.19 恋愛・ハート
- ❤️ : ❤
- 💗 : 💗
- 💖 : 💖
- 💞 : 💞
1.20 祝日・イベント
- 🎁 : 🎁
- 🎉 : 🎉
- 🎊 : 🎊
- 🎌 : 🎌
1.21 チェックなど
- ✅ : ✅
- ✔ : ✔
- ☑ : ☑
- ⚠ : ⚠
この形式なら、クラシックエディタに貼るだけで絵文字と特殊文字コードの両方を確認できます。
このリストをコピーしてブログやWebページに貼り付けるだけで、絵文字を表示できます。
2 特殊文字コードはどれくらい重い？
絵文字はブログやWebページでよく使われますが、特殊文字コード（例：😀）を大量に使うとHTMLファイルが大きくなり、ページ表示に影響することがあります。
今回は「特殊文字コードの負荷」と「軽量化の方法」をわかりやすく解説します。
- 1つの絵文字は
😀のように7文字以上を使用 - 大量に並べるとHTMLファイルのサイズが膨らむ
- ページ読み込みやレンダリング速度に微妙に影響する場合も
例：
😀😁😂3 2. HTMLを軽くする方法
3.1 UTF-8で直接書く
<
HTML文字数が少なくなる。ブラウザは通常問題なく表示。ファイルをUTF-8で保存する必要あり。
😀😁😂3.2 CSSで表示
HTMLが軽量化。装飾用に便利。
HTMLが軽量化。装飾用に便利。
.icon-smile::before {
content: "😀";
}
<span class="icon-smile"></span>3.3 JavaScriptで動的生成
ページロード時に必要な絵文字だけ描画。大量リストに有効。
<div id="emoji-list"></div>
<script>
const emojis = ["😀","😁","😂"];
document.getElementById("emoji-list").innerHTML = emojis.join(" ");
</script>3.4 画像化
絵文字をSVGやPNGに置き換える。表示は安定するがHTML/CSSが重くなる場合あり。
4 3. まとめ
- 少量：UTF-8で直接書くのが簡単
- 装飾用途：CSS
::beforeで表示 - 大量リスト：JavaScriptで動的生成
- 特定のデザイン重視：画像化も選択肢
ポイント：絵文字の表示方法を工夫すれば、特殊文字コードを使いつつもHTMLを軽量化でき、ページ速度への影響を抑えられます。
