HTML Emojis
Emojis आज हर जगह हैं — WhatsApp, Facebook, Instagram, और अब आपकी Websites पर भी! HTML में हम Emojis को आसानी से जोड़ सकते हैं ताकि आपकी वेबसाइट दिलचस्प, expressive और friendly लगे
HTML Emojis क्या होते हैं?
👉 Emoji का मतलब होता है — छोटे colorful symbols जो भावनाएँ (emotions) या विचार (ideas) व्यक्त करते हैं। जैसे 😍 (Love), 😂 (Funny), 😎 (Cool), 💡 (Idea) आदि। HTML में ये Unicode Characters होते हैं — यानी हर emoji का एक unique Unicode code point होता है। हम इन्हें HTML में इस तरह लिख सकते हैं 👇
😀 → 😀Emoji जोड़ने के 3 आसान तरीके
तरीका 1: Directly Copy-Paste Emoji आप Emoji को सीधे HTML में डाल सकते हैं, जैसे —
<p>I ❤️ HTML & CSS 😍</p>ये सबसे आसान और fast तरीका है।
तरीका 2: Unicode (Numeric Code) का इस्तेमाल
हर Emoji का Unicode होता है, जो इस तरह से लिखा जाता है
😀 → 😀
😁 → 😁
😂 → 😂Example:
<p>Learning HTML is fun 😀</p>तरीका 3: Hexadecimal Code
कभी-कभी Unicode को Hexadecimal (16-base code) में भी लिखा जाता है:
😄 → 😄
😍 → 😍
🚀 → 🚀Example:
<p>Let's code with joy 😊 🚀</p>कुछ Popular Emojis और उनके Codes
| Emoji | Unicode (Decimal) | Hex Code | Description |
|---|---|---|---|
| 😀 | 😀 | 😀 | Grinning Face |
| 😁 | 😁 | 😁 | Beaming Smile |
| 😂 | 😂 | 😂 | Laughing Tears |
| 😍 | 😍 | 😍 | Heart Eyes |
| 😎 | 😎 | 😎 | Cool Sunglasses |
| 🤔 | 🤔 | 🤔 | Thinking |
| 😴 | 😴 | 😴 | Sleeping |
| 😡 | 😡 | 😡 | Angry |
| 😇 | 😇 | 😇 | Innocent |
| 💡 | 💡 | 💡 | Idea |
| 💻 | 💻 | 💻 | Laptop |
| 📱 | 📱 | 📱 | Mobile |
| 🔥 | 🔥 | 🔥 | Fire |
| ❤ | ❤ | ❤ | Heart |
| 💔 | 💔 | 💔 | Broken Heart |
| 💰 | 💰 | 💰 | Money Bag |
| 💪 | 💪 | 💪 | Strong / Power |
| 🚀 | 🚀 | 🚀 | Rocket |
| 🌍 | 🌍 | 🌍 | Earth Globe |
| 🕓 | 🕓 | 🕓 | Clock |
Example – HTML Emojis in Action
<!DOCTYPE html>
<html lang="hi">
<head>
<meta charset="UTF-8">
<title>HTML Emojis Example</title>
</head>
<body>
<h1>HTML में Emojis का मज़ा 😍</h1>
<p>😀 Hello World!</p>
<p>🔥 Coding is Fun! 💻🚀</p>
<p>❤️ I Love HTML & CSS 😎</p>
<p>💡 Idea: Practice Daily to Become a Pro! 💪</p>
<p>🌍 Let’s build something amazing together!</p>
<h3>Using Unicode Codes 👇</h3>
<p>😀 Smile Emoji</p>
<p>😍 Love Emoji</p>
<p>🚀 Rocket Emoji</p>
</body>
</html>Output:
- 😀 Hello World!
- 🔥 Coding is Fun! 💻🚀
- ❤️ I Love HTML & CSS 😎
- 💡 Idea: Practice Daily to Become a Pro! 💪
- 🌍 Let’s build something amazing together!
- 😀 Smile Emoji
- 😍 Love Emoji
- 🚀 Rocket Emoji
Emojis को सही दिखाने के लिए Tips
- 1️⃣ <meta charset="UTF-8"> हमेशा HTML में रखें —
- ताकि Browser Emoji characters को सही समझे।
- 2️⃣ Emojis को plain text की तरह इस्तेमाल करें, कोई image नहीं हैं।
- 3️⃣ Emojis हर device पर थोड़े अलग दिख सकते हैं (Apple, Android, Windows)।
- 4️⃣ Emojis से user engagement बढ़ता है — पर overuse न करें 😅
Emojis के फायदे
- ✅ आपकी वेबसाइट को friendly और emotional touch मिलता है
- ✅ User Engagement बढ़ती है
- ✅ Modern look देता है
- ✅ Articles, blogs, FAQs, या feedback forms में perfect हैं
Practice Task
- एक HTML पेज बनाइए जिसमें:
- Header में “Welcome to My Website 😍”
- 3 Paragraph हों:
- 😎 HTML सीखना मजेदार है
- 💪 Practice रोज़ करें
- 🚀 अपने प्रोजेक्ट लॉन्च करें
- Footer में “Thank You 😊 Visit Again ❤️”
Summary
| पॉइंट | मतलब (विवरण) |
|---|---|
| Emoji = Unicode symbol | HTML में **directly** या **code** से डाल सकते हैं। |
| Direct Paste | यह इमोजी डालने का **सबसे आसान तरीका** है। |
| Unicode (\&\#128512;) | यह इमोजी को प्रदर्शित करने का एक **Browser-safe** (ब्राउज़र-सुरक्षित) तरीका है। |
| UTF-8 charset ज़रूरी | यह ज़रूरी है ताकि **Emoji सही render** (ठीक से प्रदर्शित) होंगे। इसे `` टैग से सेट किया जाता है। |
| Use wisely | Expression (भाव) बढ़ाएँ, लेकिन **ज़्यादा नहीं** 😄। उनका बुद्धिमानी से उपयोग करें। |