Google FontsのNoto Color Emojiを使用したサンプル

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
<style>
.noto-emoji {
  font-family: 'Noto Color Emoji', sans-serif;
}
</style>
<div>
  <h1>Noto Color Emoji</h1>
  <div class="noto-emoji">🙂🏞️🔮🧭🥝🦌</div>
</div>
<div>
  <h1>Original Emoji</h1>
  <div class="emoji">🙂🏞️🔮🧭🥝🦌</div>
</div>

元記事を表示する