DEV Community

Vishnubhotla V D V Bharadwaj
Vishnubhotla V D V Bharadwaj

Posted on • Originally published at bharadwaj.hashnode.dev on

3 3

Special symbols in HTML

Hello friends, hope you all doing well. In this blog, I am going to write about special symbol creation using HTML. You can ask me why should we create them. Here is the reason:

There are some special symbols that cannot be typed using a keyboard. But we can add them to our website using some codes. I am going to explain them in detail using CodePen.

Here is the first example, creating a Trademark symbol

<body>
    &trade;
</body>

Enter fullscreen mode Exit fullscreen mode

In this way, we can create many special keywords. Here is the list:

Geek Symbols

Symbol -> Name -> Code

α -> Alpha -> &alpha

β -> Beta -> &beta

γ -> Gamma -> &gamma

δ -> Delta -> &delta

ε -> Epsilon -> &epsilon

θ -> Theta -> &theta

λ -> Lamda -> &lambda

μ -> Mu -> &mu

π -> Pi -> &pi

Code for Geek symbols

<body>
  <h1>Geek Symbols</h1>
  &alpha;
  &beta;
  &gamma;
  &delta;
  &epsilon;
  &theta;
  &lambda;
  &mu;
  &pi;
</body>

Enter fullscreen mode Exit fullscreen mode

Trade Symbols

Symbol -> Name -> Code

™ -> Trademark -> &trade

® -> Registered trademark -> &reg

© -> Copyright -> &copy

Code for Trade symbols

<h1>Trade Symbols</h1>
  &trade;
  &reg;
  &copy;

Enter fullscreen mode Exit fullscreen mode

Card Symbols

Symbol -> Name -> Code

♥ -> Hearts -> heartsuit

♦ -> Diamond -> heartsuit

♠ -> Spades -> spadesuit

&Clubsuit; -> Hearts -> heartsuit

Code for Card symbols

<h1>Card Symbols</h1>
&heartsuit;
  &diamondsuit;
  &clubsuit;
  &spadesuit;

Enter fullscreen mode Exit fullscreen mode

Currency Symbols

Symbol -> Name -> Code

₹ -> Indian rupee -> &#8377

€ -> Euro -> &euro

₱ -> Peso -> &#8369

₣ -> French Franc -> &#8355

₿ -> Bitcoin -> &#8383

₩ -> Won -> &#8361

₽ -> Ruble -> &#8381

₾ -> Lari -> &#8382

Code for Currency symbols

<h1>Currency Symbols</h1>
&#8377;
  &euro;
  &#8369;
  &#8355;
  &#8383;
  &#8361;
  &#8381;
  &#8382;

Enter fullscreen mode Exit fullscreen mode

Math Symbols

Symbol -> Name -> Code

÷ -> Divide -> &divide

↑ -> Up arrow -> &uarr

→ -> Right arrow -> &rarr

↓ -> Down arrow -> &darr

← -> Left arrow -> &larr

√ -> Square root -> &radic

∝ -> Proportion -> &prop

∫ -> Integral -> &int

∴ -> Therefore -> &there4

⇒ -> Implies -> &rArr

∀ -> For all -> &forall

Code for Math symbols

<h1>Math Symbols</h1>
&divide;
  &uarr;
  &rarr;
  &darr;
  &larr;
  &radic;
  &prop;
  &int;
  &there4;
  &rArr;
  &forall;

Enter fullscreen mode Exit fullscreen mode

Outputs of all the code:

Screenshot (112).png

Screenshot (113).png

The link for Code is attached here

AWS Q Developer image

Your AI Code Assistant

Automate your code reviews. Catch bugs before your coworkers. Fix security issues in your code. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay