如何通过 CSS 使用来自 CDN 的 Google Noto Color Emoji 前端

Question

我有什么方法可以使用 CDN 的 Google 彩色表情符号字体？我试图在 jsfiddle 中使用它，但不知道如何使用。

Answer 1

你可以这样使用它：

@font-face {
  font-family: 'Noto Color Emoji';
  src: url(https://raw.githack.com/googlefonts/noto-emoji/main/fonts/NotoColorEmoji.ttf);
}

更新

您还可以尝试“Noto Colr Emoji Glyf”，这是COLRv1字体：https://fonts.googleapis.com/css2?family=Noto+Colr+Emoji+Glyf

请参阅 repo 和 demo。

但请务必检查浏览器支持，截至撰写本文时，仅 Chrome 98+ 支持。

Answer 2

这不是谷歌，但你可以尝试这个替代方案，

这里是CDN

Answer 3

我编写了一个小型开源项目，它允许您使用 Google Noto 表情符号轻松美化您的网页。

Noto.js 查找网页上的任何表情符号并将其转换为使用 Google Noto 表情符号字体。