EmojiSalon uses Twemoji SVG data for emoji rendering. You can select any emoji, customize its colors, and download your creation as SVG or PNG for personal or commercial use.

Live Page: https://emojisalon.pages.dev/showcase

Create unique emoji variations by changing colors to match your style or brand.

Adapt emojis for different cultural contexts or create region-specific variations.

Emoji accessibility is not just a binary between being able to see emoji perfectly and not being able to see them at all — it is a spectrum that accounts for multiple experiences.

For people with color vision deficiencies, color blindness, or low vision, identifying certain emojis can be challenging:

• Similar colors: Emoji may appear blurry or distorted, making it difficult to distinguish between similar-looking icons
• Color-based identification: Many users identify emoji by color or general shape rather than fine details
• Multiple emoji in sequence: When several emoji appear in a row, they can be hard to tell apart, especially with similar colors
• Small keyboard icons: Emoji keyboards have small icons arranged closely together, making selection difficult

Flag emoji with similar color schemes are particularly problematic:

• 🇮🇹 Italy vs 🇮🇪 Ireland
• 🇷🇴 Romania vs 🇹🇩 Chad
• 🇱🇻 Latvia vs 🇦🇹 Austria
• 🇲🇨 Monaco vs 🇮🇩 Indonesia

Heart emoji colors can also be easily confused:

• ❤️ Red vs 💜 Purple
• 💙 Blue vs 💜 Purple
• 💚 Green vs 🧡 Orange

Most current emoji designs do not consider these accessibility needs. EmojiSalon provides a solution by allowing users to:

• Customize emoji colors for better personal distinction
• Create high-contrast variants tailored to individual visual needs
• Generate easily distinguishable emoji for users with specific color vision deficiencies

• Emoji And Low Vision - Veronica With Four Eyes
• Are you emoji colour blind? - Colour Blind Vision

1. Clone this repository:

   git clone https://github.com/rutopio/EmojiSalon.git
   cd EmojiSalon

2. Install dependencies:

   pnpm install

3. Run the development server:

   pnpm dev

   The development server should now be running at http://localhost:5173.

pnpm run build

The app is deployed to Cloudflare Pages. The build output in dist/ can be served as a static site on any platform.

The emoji SVG data used in this application is preprocessed from Twemoji source files into one per-emoji JSON file each. The whole pipeline is a single reproducible Node script — no fonts, no Glyphs App, no manual steps.

pnpm preprocess

This shallow-clones jdecked/twemoji at a pinned tag, parses every assets/svg/*.svg (skipping skin-tone-modifier files), and writes per-emoji data to public/data/emoji/u<code>.json plus an index.json. Each file holds the emoji's SVG paths, fills, and editable colors, served as static assets and fetched on demand by both the app and the OG image function.

See preprocess/README.md for the pinned tag, output format, and details.

Your creation is based on Twemoji, licensed under CC-BY 4.0 (graphic).

This license enables reusers to distribute, remix, adapt, and build upon the material in any medium or format, so long as attribution is given to the creator. The license allows for commercial use.

The author does not own any copyright to your work.

Code licensed under the MIT License: http://opensource.org/licenses/MIT

• justfont