OSS探訪
GitHubで見る

Unicode emojiを統一デザインのPNG・SVGへ置換し、platform間の表示差を吸収する

OSS規模スコア 未算出OSS健全度 80
スコアの見方

OSS規模スコアはStars・Watchers・Forks・Contributorsを対数圧縮して重み付けした現在の規模指標（上限なし）です。発掘スコアは現在のOSS規模スコアから発掘時点のOSS規模スコアを引いた値、更新ペースは直近30日Commit数、成長モメンタムは直近の観測期間におけるOSS規模スコア差、OSS健全度は取得できた更新状況・Community Health・Releaseの0〜100評価です。

Stars
17,794
主要言語
HTML
ライセンス
MIT
リポジトリ最終更新
2026/07/07
ページ内ナビ

概要

Twemojiは、Unicode emojiを共通の画像assetで表示するJavaScript libraryとemoji graphicsの集合です。DOM内のtext nodeを走査してemojiをimgへ置換でき、PNGまたはSVG、asset base URL、class名等を指定できます。masterのpackage metadataとREADMEは14.0.3を示し、Emoji 14.0/RGI emojiを対象にしています。

特徴と向いている用途

公式資料に基づく紹介・実機未検証 · 内容確認日：

主な特徴

DOM内のUnicode emojiを画像へ安全寄りに置換する

twemoji.parse(element)はtext node内のemojiを画像へ置換し、周囲のDOM nodeやlistenerを維持します。READMEはsecurityを重視する場合にDOM parsingを推奨しています。

出典：[2]

PNG・SVGやasset配信先を用途に合わせて切り替える

base、size、folder、ext等のoptionを使い、self-hostしたassetや任意CDNからPNG/SVGを配信できます。class名やcallbackもcustomizeできます。

出典：[2]

向いている用途

OSやbrowserごとの差に依存せず同じemoji見た目を提供したいWeb UIに向く

support画面、chat、social UI等でnative emoji fontの差を避け、同じgraphic setを全利用者へ表示したい場合に向きます。

出典：[2]

導入前の確認

graphicsはMITではなくCC BY 4.0で、帰属表示が必要になる

JavaScript codeはMITですが、emoji graphicsはCC BY 4.0です。graphicsを配布・表示する場合はREADMEとLICENSE-GRAPHICSのattribution条件を確認し、README、About、footer等へ適切な帰属を用意します。

出典：[2][5][6]

string parsingとversion/CDNの前提を見直す

READMEはstring parsingが入力をsanitizeしないため非推奨とし、DOM parsingを勧めています。また旧MaxCDNは停止しており、masterはunpkgまたはasset downloadを案内します。GitHub latest releaseはv14.0.2ですが、master package metadataとREADMEは14.0.3を示しています。

出典：[2][3][4]

参考にした公式資料

  1. [1]twitter/twemoji repository(2026-09-30)
  2. [2]Twemoji README(2026-09-30)
  3. [3]Twemoji package metadata(2026-09-30)
  4. [4]Twemoji v14.0.2 GitHub release(2026-09-30)
  5. [5]Twemoji code MIT license(2026-09-30)
  6. [6]Twemoji graphics CC BY 4.0 license(2026-09-30)
編集部からの補足

native emojiのOS差をなくせる一方、graphicsにはCC BY 4.0の帰属要件があります。導入時はJavaScript codeのMIT表示だけで済ませず、実際に配布する画像assetのlicense表示まで設計に含めてください。

3ステップで試す

  1. 1

    Twemoji 14.0.3を追加

    masterのpackage metadataとREADMEが示す14.0.3をversion固定で追加します。

    npm install twemoji@14.0.3
  2. 2

    DOM parserを読み込む

    string parsingはsanitizeしないため、READMEが推奨するDOM parsingを使います。

    import twemoji from 'twemoji';
  3. 3

    document内のemojiを変換

    text node内のUnicode emojiを画像へ置換します。実運用ではgraphicsのCC BY 4.0帰属表示とasset配信先も設定します。

    twemoji.parse(document.body);
公式READMEで確認

成長

成長の推移 · 直近30日

17,794 Stars

推移データを蓄積中です。

Built with

カテゴリとタグ

カテゴリ

タグ

GitHubデータ

GitHubのデータGitHubの詳細データを見る
GitHubで見る

GitHub Topics

  • emoji
  • twemoji
Stars
17,794
Forks
1,901
Watchers
330
Open Issues
144
所有者種別
Organization
主要言語
HTML
ライセンス
MIT
リポジトリ最終更新
2026/07/07
関連記事を投稿する

このOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。

情報の誤りを報告

掲載内容に誤りや古い情報があればお知らせください。

このページを読んで、次に何をすればよいか分かりましたか？