samuelngs / apple-emoji-linux Goto Github PK
View Code? Open in Web Editor NEWBrings Apple's vibrant emojis to your Linux experience
License: Apache License 2.0
Brings Apple's vibrant emojis to your Linux experience
License: Apache License 2.0
Hi guys, awesome font file - any chance it can be updated to the newest Unicode 15/iOS 16 emojis?
I can't seem to fully understand the naming conventions used by noto-emoji, and similarly by this project. I have an opentype color font using CBDT & SVG, and I can extract SVGs and PNGs just fine. How do you usually sort the naming, is there maybe an easier solution to extract? (Currently using FontLab 8). Is there maybe a script I've missed? My goal is to compile color emojis into a font that uses a COLR table. Thanks.
First, let me thank you for the effort in creating that project!
Perhaps you could tell the standard you are using for creating the ttf.
I'm using 12.1 https://unicode.org/Public/emoji/12.1/emoji-test.txt and there I noticed some missing icons like the medical emoji. Is there any way you could include it or even update the standard to a more recent one (standard 12 is from 2018)?
You can find an overview of all the standards here https://unicode.org/Public/emoji/
Hi, I'm currently using Arch i3 and since I installed your emojis, I have a huge bug on the Todoist site, indeed, all the spaces of the site are particularly big
Hello,
When I run make -j
, I see some errors there:
❯ make
which: no zopflipng in (/usr/local/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Applications/Wireshark.app/Contents/MacOS:/usr/local/opt/coreutils/libexec/gnubin:/Users/josefranciscoverdugambin/dotfiles/utils:/Users/josefranciscoverdugambin/.cabal/bin)
which: no optipng in (/usr/local/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Applications/Wireshark.app/Contents/MacOS:/usr/local/opt/coreutils/libexec/gnubin:/Users/josefranciscoverdugambin/dotfiles/utils:/Users/josefranciscoverdugambin/.cabal/bin)
which: no add_vs_cmap.py in (/usr/local/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Applications/Wireshark.app/Contents/MacOS:/usr/local/opt/coreutils/libexec/gnubin:/Users/josefranciscoverdugambin/dotfiles/utils:/Users/josefranciscoverdugambin/.cabal/bin)
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/Users/josefranciscoverdugambin/Downloads/apple-emoji-linux/add_emoji_gsub.py", line 24, in <module>
from fontTools import agl
ImportError: No module named fontTools
not sure if this affects the process 🤔
It seems like the emojis are installed and rendered properly, but the color is always the same as the text.
I use it to render fabric.js on top of node-canvas, running on docker image with alpine and node 18.
I tried to dig up some sources around with the following information:
01-emoji.conf
file, no luck.Here is my Dockerfile configs:
FROM node:18-alpine
# Download the font file
RUN apk --no-cache add wget \
&& wget -O /tmp/AppleColorEmoji.ttf https://github.com/samuelngs/apple-emoji-linux/releases/latest/download/AppleColorEmoji.ttf
# Create the font directory
RUN mkdir -p /usr/share/fonts/truetype/apple-emoji
# Copy the font file to the directory
RUN cp /tmp/AppleColorEmoji.ttf /usr/share/fonts/truetype/apple-emoji/AppleColorEmoji.ttf
# Set permissions for the font file
RUN chmod 644 /usr/share/fonts/truetype/apple-emoji/AppleColorEmoji.ttf
COPY ./src/canvas-renderer/linux-configs/01-emoji.conf /etc/fonts/conf.d/01-emoji.conf
COPY ./src/canvas-renderer/linux-configs/45-generic.conf /etc/fonts/conf.d/45-generic.conf
COPY ./src/canvas-renderer/linux-configs/60-generic.conf /etc/fonts/conf.d/60-generic.conf
# Rebuild the font cache
RUN apk --no-cache add fontconfig \
&& fc-cache -f -v
# Remove the temporary font file
RUN rm /tmp/AppleColorEmoji.ttf
RUN echo 'kernel.unprivileged_userns_clone=1' >> /etc/sysctl.d/00-alpine.conf \
&& mkdir -p app \
&& apk add --no-cache \
nss \
freetype \
freetype-dev \
harfbuzz \
ca-certificates \
ttf-freefont \
sudo \
curl \
build-base \
g++ \
libpng \
libpng-dev \
jpeg-dev \
pango-dev \
cairo-dev \
giflib-dev \
python3 \
;
01-emoji.conf:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
<alias>
<family>serif</family>
<prefer>
<family>Apple Color Emoji</family>
</prefer>
</alias>
<alias>
<family>sans-serif</family>
<prefer>
<family>Apple Color Emoji</family>
</prefer>
</alias>
<alias>
<family>monospace</family>
<prefer>
<family>Apple Color Emoji</family>
</prefer>
</alias>
</fontconfig>
45-generic.conf
<alias binding="same">
<family>Apple Color Emoji</family> <!-- Apple -->
<default><family>emoji</family></default>
</alias>
<!-- Add language for emoji, to match other emoji fonts. -->
<match>
<test name="family">
<string>emoji</string>
</test>
<edit name="lang" mode="prepend">
<string>und-zsye</string>
</edit>
</match>
<match>
<test name="lang">
<string>und-zsye</string>
</test>
<test qual="all" name="family" compare="not_eq">
<string>emoji</string>
</test>
<!-- Add generic family. -->
<edit name="family" mode="append" binding="strong">
<string>emoji</string>
</edit>
</match>
60-generic.conf
<!-- Emoji -->
<!-- Prefer to match color emoji font. -->
<match>
<test name="lang">
<string>und-zsye</string>
</test>
<test qual="all" name="color" compare="not_eq">
<bool>true</bool>
</test>
<test qual="all" name="color" compare="not_eq">
<bool>false</bool>
</test>
<edit name="color" mode="append">
<bool>true</bool>
</edit>
</match>
<!-- TODO
! Match on "color" and alias B&W ones first if no color is requested.
! That's "hard" because <alias> doesn't work in match and needs to be
! expanded to its non-sugar form.
!-->
<alias binding="same">
<family>emoji</family>
<prefer>
<!-- System fonts -->
<family>Apple Color Emoji</family> <!-- Apple -->
</prefer>
</alias>
Hello,
maybe I'm not getting something regarding fontconfig, but here is the problem:
I was using old AUR package with emojis, I've removed the package and moved to this package. Later after reboot I've noticed that some emojis are not working and I see blank space. I was playing with fontconfig (found out that Twemoji has those emojis), according to Emojipedia
Now, I've changed my fontconfig to have something like:
<alias binding="same">
<family>Apple Color Emoji</family>
<prefer>
<family>Apple Color Emoji</family>
<family>Twemoji</family>
</prefer>
</alias>
<alias binding="strong">
<family>emoji</family>
<prefer>
<family>Apple Color Emoji</family>
<family>Twemoji</family>
</prefer>
</alias>
<alias binding="strong">
<family>EmojiOne</family>
<prefer>
<family>Apple Color Emoji</family>
<family>Twemoji</family>
</prefer>
</alias>
<alias binding="strong">
<family>Emoji One</family>
<prefer>
<family>Apple Color Emoji</family>
<family>Twemoji</family>
</prefer>
</alias>
...
And if I check ie.
$ fc-match 'Source Sans Pro' -s
NotoSansNerdFont-Regular.ttf: "NotoSans Nerd Font" "Regular"
NotoSansNerdFont-Italic.ttf: "NotoSans Nerd Font" "Italic"
apple-color-emoji.ttf: "Apple Color Emoji" "Regular"
twemoji.ttf: "Twemoji" "Regular"
I can see the proper order I wanted... but in a browser/any application, I cannot see Twemoji emojis on regional ones, but still blank space. If I modify font-family in DevTools and add Twemoji as first, then it renders properly.
Previously I was using noto-fonts-emoji-apple.
I think GitHub much have changed something, because https://github.com/samuelngs/apple-emoji-linux/releases/download/latest/AppleColorEmoji.ttf no longer works.
Update: apparently this works: https://github.com/samuelngs/apple-emoji-linux/releases/latest/download/AppleColorEmoji.ttf ¯\_(ツ)_/¯
Is there a way to make it work system-wide and in all programs (in firefox too)?
I use Manjaro KDE
can you pls update the .ttf file?
hi, thanks again for your great work. could you please update it with the newest release? ❤️
it's available here.
So.. i was hoping to use this font to replace the hideous Windows 10 / 11 emoji font..
But Windows doesn't recognize this TTF as a valid font ?
I've never encountered TTF files that were OS specific , so is there something in the file that makes it incompatible ?
Would it be possible to make this font as usable as the TweMoji one : https://github.com/eosrei/twemoji-color-font
(though ,that being said, i've failed to install TweMojio in Windows 11...but it DOES open just fine)
edit:
I've found some online font converters which might be able to fix the file.
The filesize is too big though !
Any chance that there could be a second version with smaller Emoji's and thereby smaller filesize ?
(Maybe thats also why Windows doesn't accept the TTF .. )
When I used the ttf file you generated from Release Page, I found that the font of emoji is bigger than the ttf that comes with my mac.
Use the ttf from my mac:
It can be seen from the above that the size of the emoji is the same as the text.
Use the ttf from this repo:
You can see from the above that the size of the emoji is larger than the text.
Hi,
Was checking out pngs it seems the flags of different countries of world is missing. Will they be added?
Thanks,
Mitesh
please update the 16.4 release available here :)
I don't want the numbers to be shown as emojis. I want to display them as normal characters because they have abnormal spaces when converted to emojis. I noticed the same issue with Noto fonts.
I tried to built from the source and remove images of numbers (non emojis) manually from png folder. Now the numbers are not visible at all when using this font. Is there any way to fix it?. I am using it on Android
When testing this font with https://getemoji.com, I see that the skiing and the sleeping emojis under the "Pale Emojis" section (and also the other colored human emojis) show an additional square beside them, as shown in the screenshot below. (Please see the last row and the right side of the 4th row from the top).
When testing with Noto Emoji fonts, the issue is not seen.
Seems like the glyph for 'rightward pushing hand' is missing. Looking in this repo, I see leftward pushing hand right here: https://github.com/samuelngs/apple-emoji-linux/blob/ios-16.4/png/160/emoji_u1faf7.png, but 'emoji_u1faf8.png' does not seem to exist.
Here are two screenshots (from getemoji.com and www.utf8-chartable.de):
Thanks!
Hello!
Some days ago there was an update in emojis and unicode standard.
I want to update the font, but I don't how.
Greetings
Hi, I am sorry to ask this simple question but am confused about permissions:
"The code provided is for educational purposes only. Apple is a trademark of Apple Inc., registered in the U.S. and other countries."
Does it mean there's no permission for personal use this font (Downloading the font file from releases and using it)?
I managed to build the TTF file from the source on my Mac, but some emojis like [🏳️🌈] and [🏴☠️], as well as a few other emojis like family, are not visible, also the image file of the missing emojis are present in the PNG folder. However, it's working fine in the TTF file uploaded on the release page What could be the reason for this inconsistency?
Additionally, I want to remove number emojis (U+0030 to U+0039). I tried deleting the PNG files, but now the numbers are not showing at all. From where can I remove them? I couldn't find any list of emojis that are mapped.
After pip install fontTools
(#1) fonts are generated in fonts/
but there is an errors
apple-emoji-linux on master [?]
➜ make -j
which: no zopflipng in (/home/grawl/.yarn/bin:/home/grawl/.yvm/shim:/home/grawl/.nvm/versions/node/v13.7.0/bin:/var/lib/snapd/snap/bin:/usr/lib64/qt-3.3/bin:/usr/share/Modules/bin:/usr/lib64/ccache:/usr/local/bin:/usr/local/sbin:/usr/bin:/usr/sbin:/home/grawl/bin:/var/lib/snapd/snap/bin)
which: no optipng in (/home/grawl/.yarn/bin:/home/grawl/.yvm/shim:/home/grawl/.nvm/versions/node/v13.7.0/bin:/var/lib/snapd/snap/bin:/usr/lib64/qt-3.3/bin:/usr/share/Modules/bin:/usr/lib64/ccache:/usr/local/bin:/usr/local/sbin:/usr/bin:/usr/sbin:/home/grawl/bin:/var/lib/snapd/snap/bin)
which: no add_vs_cmap.py in (/home/grawl/.yarn/bin:/home/grawl/.yvm/shim:/home/grawl/.nvm/versions/node/v13.7.0/bin:/var/lib/snapd/snap/bin:/usr/lib64/qt-3.3/bin:/usr/share/Modules/bin:/usr/lib64/ccache:/usr/local/bin:/usr/local/sbin:/usr/bin:/usr/sbin:/home/grawl/bin:/var/lib/snapd/snap/bin)
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
Traceback (most recent call last):
File "./flag_glyph_name.py", line 25, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
mkdir -p "build/dump/unicode"
Makefile:146: *** "add_vs_cmap.py not in path, run setup.py in nototools". Останов.
make: *** Ожидание завершения заданий…
Traceback (most recent call last):
File "add_glyphs.py", line 22, in <module>
import add_emoji_gsub
File "/home/grawl/IdeaProjects/apple-emoji-linux/add_emoji_gsub.py", line 28, in <module>
from nototools import font_data
ModuleNotFoundError: No module named 'nototools'
make: *** [Makefile:211: AppleColorEmoji.tmpl.ttx] Ошибка 1
Hi 👋, I found this repository which is very useful for me. I am using this font to replace the system default emoji font in my web development, but when I replace it, I found that some of the emojis are not showing up. My question is, is this the reason for the font, or something else?
I downloaded this font to my asset folder and referenced it in css using @font-face
like this:
@font-face {
font-family: 'My Apple Color Emoji';
src: url('./AppleColorEmoji.ttf');
}
html,body {
margin: 0;
font-family: system-ui,'Apple Color Emoji','My Apple Color Emoji', -apple-system, BlinkMacSystemFont, sans-serif, 'Segoe UI' !important;
}
I then typed windows keyboard emoji in the input box and found it worked as expected.
I'm making an emoji panel using Vue. So I referenced https://cdn.jsdelivr.net/npm/[email protected]/+esm as the list of emoji metadata that the emoji panel needs to contain.
The structure of this file is a json list with unified
fields for each item:
[
{
"name": "HASH KEY",
"unified": "0023-FE0F-20E3",
"non_qualified": "0023-20E3",
"docomo": "E6E0",
"au": "EB84",
"softbank": "E210",
"google": "FE82C",
"image": "0023-fe0f-20e3.png",
"sheet_x": 0,
"sheet_y": 0,
"short_name": "hash",
"short_names": [
"hash"
],
"text": null,
"texts": null,
"category": "Symbols",
"subcategory": "keycap",
"sort_order": 1521,
"added_in": "0.6",
"has_img_apple": true,
"has_img_google": true,
"has_img_twitter": true,
"has_img_facebook": false
},
...
]
I use the following code to generate emoji unicode from javascript:
String.fromCodePoint(emoji.unified.split('-').map(it => `0x${it}`))
When I use v-for
to display all the items, I found that some of the emoji slots are empty (empty because I use try-catch syntax to do the processing, otherwise it will have an error), and more of them are missing, even the 👁
emoji is not there, I am very puzzled, and I would like to ask if there is something wrong with my code or the Apple coloe emoji.ttf
file?
I would be very grateful if you could answer!
Here is my emoji panel code (simplified with some logic):
<template>
<div>
<div v-for="(emojis, category) in state.emojiMap" :key="category">
<div class="grid p-2 gap-2 grid-cols-6">
<button
v-for="(emoji) in emojis"
:key="emoji.unified"
:title="emoji.name">
<span>{{ emojiCode(emoji) }}</span>
</button>
</div>
</div>
</div>
<template>
<script setup>
import emojiPack from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm'
const emojis = sortByCategory(emojiPack)
const state = reactive({
emojiMap: emojis
})
function emojiCode({ unified }){
try{
return String.fromCodePoint(unified.split('-').map(it => `0x${it}`))
}catch(e){
return ''
}
}
</script>
The rendering is below, with a lot of emoji missing because they report errors:
When an error is reported (with the try-catch protection removed), the console output is as follows:
Uncaught (in promise) RangeError: Invalid code point NaN
at Function.fromCodePoint (<anonymous>)
at Proxy.emojiCode (EmojiPanel.vue:104:19)
at EmojiPanel.vue:9:26
at renderList (runtime-core.esm-bundler.js:2755:16)
at Proxy._sfc_render (EmojiPanel.vue:12:22)
at renderComponentRoot (runtime-core.esm-bundler.js:816:16)
at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5701:46)
at ReactiveEffect.run (reactivity.esm-bundler.js:178:19)
at instance.update (runtime-core.esm-bundler.js:5814:51)
at setupRenderEffect (runtime-core.esm-bundler.js:5822:5)
Here are some missing emoji unifieds that I used the try-catch statement and printed in the catch:
1F3F3-FE0F
1F3F3-FE0F-200D-1F308
1F3F3-FE0F-200D-26A7-FE0F
1F3F4-200D-2620-FE0F
1F1E6-1F1E8
1F1E6-1F1E9
1F1F8-1F1EA
1F1F8-1F1EC
1F1F8-1F1ED
I followed the instructions, rebuild the cache and even tried a reboot, but the new emojis just won't be used by my Ubuntu PC. I still see the old, ugly ones.
I'm on Ubuntu 22.04.03.
I checked and I only have AppleColorEmoji.ttf in ~/.local/share/fonts/ so there shouldn't be any conflicts with different fonts.
How can this be applied on Windows 10 machines? Thanks!
Since unicode.org is down, the emoji-sequences file should be hosted on this repo. Google still has it cached here
I'm using Android 13 and I've applied the font for emojis. In some specific Apps, it displays both black-and-white and color emoji. For example, I type star⭐ and a kissing face😘, and it shows a color star and a black-and-white kissing face. I want to remove black-and-white emojis, and how can I do that? Or is there a solution to make the color emoji superior to black-and-white one?
I installed the font on Fedora 37, and after rebooting it worked. But today I noticed some emojis are glitching, I am not sure how to explain that...
If I open that page https://github.com/material-components/material-web this is what I see:
At first I thought it was just people using different emojis so I tried to edit the readme there to fix that, but in the editor the emojis are the same (have the same unicode?).
Why are the check marks, and cross emojis not having the same appearance here? I don't understand.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.