Any style. Any size. Any format. One click.
| 🎭 5 styles | Twitter, Google, OpenMoji, Apple, System |
| 🔍 Instant search | Filter by name or keyword, sidebar by category |
| 🖼️ Big preview | Click any emoji to see it full size |
| 📦 Export | SVG · PNG · WebP — 64 to 1024px + custom |
| 🗜️ ZIP all sizes | All 5 sizes + SVG in one click |
| 📋 Copy | SVG code or image straight to clipboard |
| 🌙 Dark / light | Toggle in the header |
| ⌨️ Keyboard | Press / to jump to search |
| 📱 Mobile | Bottom sheet export UI |
Zero build step. Zero dependencies to install. Just open index.html.
python3 -m http.server 8080
# open http://localhost:8080or npx serve . or make serve.
Instead of loading thousands of individual SVG files, EmojiCraft uses COLR/CPAL color emoji fonts for the grid. Each style loads a single font file once (cached by the browser). Only the selected emoji's full-quality SVG is fetched on click.
| Style | Grid rendering | Source |
|---|---|---|
| System | OS native emoji | zero requests |
| X (Twitter) | PNG lazy-load | emoji-datasource-twitter |
| Noto Color Emoji font | Google Fonts (1 CSS request) | |
| Apple | PNG lazy-load | emoji-datasource-apple |
| Meta (Facebook) | PNG lazy-load | emoji-datasource-facebook |
| OpenMoji | OS native (SVG on preview) | OpenMoji CDN |
| Browser | Min version | Notes |
|---|---|---|
| Chrome / Edge | 98+ | Full COLR v0 + v1 |
| Firefox | 107+ | Full COLR v0 + v1 |
| Safari | 16.4+ | Full COLR v0 + v1 |
| Older browsers | any | Falls back to system emoji silently |
~97% of global users (2026). Unsupported browsers see system emoji in the grid; preview always works.
By default the app loads emoji SVGs from public CDNs (jsDelivr). If you want to serve them yourself — for offline use, faster loads, or no external dependencies — you can download everything locally.
make download-assets
# or directly:
bash scripts/download-assets.shDownloads 3 font files → assets/fonts/ + ~1 800 emojis × 4 styles → assets/emoji/. Then flip the flag in js/sources.js:
const LOCAL_ASSETS = true; // was falseOptions:
make download-assets ARGS="--styles twemoji noto" # specific styles only
make download-assets ARGS="--no-fonts" # skip font files, SVGs only
make download-assets ARGS="--force" # re-download existing files
make download-assets ARGS="--jobs 16" # more parallelism (default: 8)A workflow is included at .github/workflows/update-emoji-assets.yml. It runs manually only by default (no cron). To trigger it:
GitHub → Actions → Update Emoji Assets → Run workflow
It downloads fresh assets and opens a Pull Request for you to review before merging. No direct commits to main.
To enable the weekly schedule, uncomment these lines in the workflow file:
# schedule:
# - cron: '0 4 * * 0' # every Sunday 04:00 UTCIssues and PRs welcome — see CONTRIBUTING.md.
If this saved you time, you can buy me a coffee ☕ — it helps a lot!
Made with 💛 by Alberto