Emoji Picker & Unicode Info
Browse 300+ emoji by name and category. Click any emoji to see its Unicode code point, HTML entity, and CSS content value — all copyable with one click. Runs entirely in your browser.
Frequently Asked Questions
What is a Unicode code point?▼
A Unicode code point is the unique number assigned to every character in the Unicode standard, written as U+XXXX in hexadecimal. For example, 😀 is U+1F600. The Unicode standard covers over 140,000 characters across 159 scripts, plus symbols, emoji, and special characters. Code points range from U+0000 to U+10FFFF.
How do I use an emoji in HTML?▼
Use the HTML entity format: 😀 for 😀. You can also use decimal: 😀. Modern HTML5 documents with UTF-8 charset can include emoji directly. In CSS content property, use the backslash format: content: '\1F600'. In JavaScript, you can use String.fromCodePoint(0x1F600) or directly paste the emoji.
Why do some emoji look different on different devices?▼
Emoji rendering is controlled by the operating system's emoji font — Apple Color Emoji on iOS/macOS, Noto Color Emoji on Android/Linux, Segoe UI Emoji on Windows. Each vendor designs their own visual interpretation of Unicode emoji. The character (code point) is the same, but the glyph appearance varies. This is by design — Unicode defines the meaning, not the visual.
What are ZWJ sequences?▼
ZWJ (Zero Width Joiner, U+200D) sequences combine multiple emoji into one composite emoji. For example: 👨 + ZWJ + 💻 = 👨💻 (man technologist). Family emoji like 👨👩👧👦 are sequences of 4 emoji joined by 3 ZWJs. Not all platforms render all ZWJ sequences — they fall back to the individual emoji if unsupported.
What is the CSS content trick for emoji?▼
The CSS content property lets you insert emoji via ::before / ::after pseudo-elements: .icon::before { content: '\1F680'; }. This keeps emoji in CSS rather than HTML markup. Note: this is useful for decorative icons, but avoid for meaningful content (screen readers handle inline emoji better). The backslash-hex format is the CSS encoding for Unicode code points.
Related Products
on GumroadDeveloper Productivity Bundle
Stop rebuilding the same setup every project. 51 VSCode snippets, 40 Git aliases, 5 Docker Compose stacks, 5 GitHub Actions workflows, 5 README templates, and a dotfiles kit. Set up a professional dev environment in under an hour.
Buy on Gumroad →AI Prompt Engineering Toolkit
58 structured prompt templates for Claude, ChatGPT, and Gemini — organized by use case. Code Review, Debugging, Documentation, Architecture, and 10 model-specific tips. Stop writing prompts from scratch.
Buy on Gumroad →Developer Cheat Sheet Bundle
10 print-ready cheat sheets for the tools developers use every day: Git, Docker, Linux CLI, SQL, Regex, HTTP Status codes, VS Code shortcuts, Bash scripting, jq/JSON, and Markdown.
Buy on Gumroad →You Might Also Need
CSS Specificity Calculator
Calculate CSS selector specificity as (inline, ID, class, element) notation. Compare two selectors to see which wins the cascade. Supports :not(), :is(), :has(), :where(), attribute selectors, and pseudo-elements.
Open free tool →
CSS Clip-Path Generator
Generate CSS clip-path values visually. Choose from 16 polygon presets (triangle, star, arrow, hexagon), circle, ellipse, and inset shapes. Live preview, one-click copy. Free, no signup.
Open free tool →
HTML to Markdown Converter
Convert HTML to Markdown instantly. Supports headings, bold, italic, links, images, lists, tables, code blocks, and blockquotes. Free online tool, runs in your browser.
Open free tool →
More Free Tools
Related Articles
Color Picker Tools for Developers: HEX, RGB, HSL, and CSS Custom Properties in 2026
Use color picker tools effectively in web development. HEX/RGB/HSL conversion, CSS theming with custom properties, WCAG contrast checking, and palette generation.
Color Picker Hex RGB — Convert and Pick Colors for Web Development
Color picker hex RGB — convert between HEX, RGB, HSL, and CSS color formats instantly. Learn how color systems work in CSS, JavaScript, and design tools with practical examples.
CSS Gradient Generator Online: Create Linear, Radial & Conic Gradients Free
Generate beautiful CSS gradients online for free. Build linear, radial, and conic gradients visually, copy the CSS code, and use it instantly in your project — no install needed.
CSS Gradient Guide 2026: Linear, Radial, Conic, and Advanced Patterns
Master CSS linear, radial, and conic gradients with copy-paste code. Includes performance tips, animation techniques, dark mode handling, gradient mesh alternatives, and production UI design recipes.
HTML/CSS/JavaScript Fundamentals: The Core Every Developer Must Know in 2026
Essential HTML semantics, CSS specificity, JavaScript async patterns, event loop, and DOM performance techniques that separate senior developers from juniors in 2026.
Enjoying this tool? Get more like it.
Weekly developer tool guides, productivity playbooks & AI tricks. Free. No spam.
Unlock AI-Powered Dev Tools
- ⚡ AI Code Review, Doc Generator & SQL Builder
- ⚡ All premium templates & early access
- ⚡ Member discounts on Gumroad products
$9/mo after trial · Cancel anytime
Want the full toolkit?
Get DevPlaybook Pro
Every template, guide, boilerplate, and automation script in one bundle. 13 premium products — grab them all at once and save big.
MIT licensed · Instant download · No subscription
See what's included → Browse all deals →