Professional Documents
Culture Documents
You don't need icons! Here are 100+ unicode
symbols that you can use
Danny Markov December 3rd, 2014
Ever needed to add an icon to your design, but you didn’t want to include images or an entire icon font like Font
Awesome into your page? We’ve got good news for you – there is a vast library of available icons and glyphs
already in your browser. It is called Unicode, and it is a standard which assigns a unique identifier for an ever
expanding number (currently over 110 000) of characters, symbols and icons.
This doesn’t mean that you have a choice of a hundred thousand icons, though. It is up to the browser to render
them, and it uses the fonts which are installed on the system to do so. In this article, we’ve collected a number
of symbols that are available across Windows, Linux, OS X, Android and iOS. You can use them in your web
designs today!
Tip: There is a good article which explains everything you need to know about character encodings and
unicode, which we recommend for every software developer to read.
How to use these icons
The icons given in the tables below, are regular characters, which you can copy and paste as if they are letters
of text. But if the encoding used to save your HTML/CSS files is not UTF8 they might not show up. This is
why we’ve provided an HTML escape code, which will always work. Here is what you need to do to use these
icons:
1. Find an icon that you like. We’ve provided small and large previews.
2. Copy the code.
3. Paste it in your HTML as regular text. In your CSS, you can use it as the value of the content property. In
JS, PHP and other programming languages, you can use it as text in strings.
4. You can customize the icons by setting a fontsize, color and text shadows, just like regular text.
Iconlike
Smiley ☺;
Hot Springs ♨;
8Ball ➑ ➑ ➑;
White Star ☆ ☆ ☆;
Black Star ★ ★ ★;
White Heart ♡ ♡ ♡;
Black Heart ❤;
Name Preview Code
Airplane ✈;
Black Scissors ✂;
White Scissors ✄ ✄ ✄;
Crown ♕ ♕ ♕;
Cross ✝;
BlackWhite Circle ◑ ◑ ◑;
Eight Note ♪ ♪ ♪;
Beamed Eighth Notes ♫ ♫ ♫;
Four BalloonSpoked Asterisk ✣ ✣ ✣;
Circled White Star ✪ ✪ ✪;
White Star ✰ ✰ ✰;
White Four Pointed Star ✧ ✧ ✧;
Name Preview Code
Black Four Pointed Star ✦ ✦ ✦;
Ballot Box Check ☑;
Check Mark ✔;
Cross Mark ✘ ✘ ✘;
Pencil ✎ ✎ ✎;
Writing Hand ✍;
Female ♀ ♀ ♀;
Male ♂ ♂ ♂;
Black Telephone ☎;
White Telephone ☏ ☏ ☏;
Envelope ✉;
Telephone Location ✆ ✆ ✆;
Arrows
Name Preview Code
Leftwards Arrow ← ← ←;
Rightwards Arrow → → →;
Upwards Arrow ↑ ↑ ↑;
Downwards Arrow ↓ ↓ ↓;
Left Right Arrow ↔ ↔ ↔;
Up Down Arrow ↕;
Right And Left Arrows ⇄ ⇄ ⇄;
Up And Down Arrows ⇅ ⇅ ⇅;
DownLeft 90deg Arrow ↲ ↲ ↲;
DownRight 90deg Arrow ↳ ↳ ↳;
UpLeft 90deg Arrow ↰ ↰ ↰;
UpRight 90deg Arrow ↱ ↱ ↱;
Name Preview Code
Leftwards Arrow To Bar ⇤ ⇤ ⇤;
Rightwards Arrow To Bar ⇥ ⇥ ⇥;
Anticlockwise Semicircle Arrow ↶ ↶ ↶;
Clockwise Semicircle Arrow ↷ ↷ ↷;
Anticlockwise Circle Arrow ↺ ↺ ↺;
Clockwise Circle Arrow ↻ ↻ ↻;
WideHeaded Rightwards Arrow ➔ ➔ ➔;
Downwards Zigzag Arrow ↯ ↯ ↯;
North West Arrow ↖;
Heavy South East Arrow ➘ ➘ ➘;
Heavy Rightwards Arrow ➙ ➙ ➙;
Heavy North East Arrow ➚ ➚ ➚;
Name Preview Code
Dashed Rightwards Arrow ➟ ➟ ➟;
Dotted Leftwards Arrow ⇠ ⇠ ⇠;
Black Rightwards Arrowhead ➤ ➤ ➤;
Leftwards White Arrow ⇦ ⇦ ⇦;
Rightwards White Arrow ⇨ ⇨ ⇨;
Left Angle Quotation Mark « « «;
Right Angle Quotation Mark » » »;
Right Black Pointer ► ► ►;
Left Black Pointer ◀;
Up Black Pointer ▲ ▲ ▲;
Down Black Pointer ▼ ▼ ▼;
Right White Pointer ▷ ▷ ▷;
Name Preview Code
Left White Pointer ◁ ◁ ◁;
Up White Pointer △ △ △;
Down White Pointer ▽ ▽ ▽;
Bow Arrow ➴ ➴ ➴;
Special
Numero № № №;
Copyright © © ©;
Registered ® ® ®;
Trademark ™ ™ ™;
Estimated ℮ ℮ ℮;
Bullet • • •;
Middle Dot · · ·;
Currency
Euro € € €;
Pound £ £ £;
Lira ₤ ₤ ₤;
Yen ¥ ¥ ¥;
Cent ¢ ¢ ¢;
Currency ¤ ¤ ¤;
Weather
Degree ° ° °;
Small Sun ☀;
Big Sun ☼ ☼ ☼;
Cloud ☁;
Name Preview Code
Snowflake 1 ❆ ❆ ❆;
Snowflake 2 ❅ ❅ ❅;
Snowflake 3 ❄;
Pointers
Pointer Left Black ☚ ☚ ☚;
Pointer Right Black ☛ ☛ ☛;
Pointer Left White ☜ ☜ ☜;
Pointer Up White ☝;
Pointer Right White ☞ ☞ ☞;
Pointer Down White ☟ ☟ ☟;
Card Suits
Hearts Black ♥ ♥ ♥;
Diamonds Black ♦ ♦ ♦;
Clubs Black ♣ ♣ ♣;
Spades White ♤ ♤ ♤;
Hearts White ♡ ♡ ♡;
Diamonds White ♢ ♢ ♢;
Clubs White ♧ ♧ ♧;
Chess
King White ♔ ♔ ♔;
Queen White ♕ ♕ ♕;
Rook White ♖ ♖ ♖;
Name Preview Code
Bishop White ♗ ♗ ♗;
Knight White ♘ ♘ ♘;
Pawn White ♙ ♙ ♙;
King Black ♚ ♚ ♚;
Queen Black ♛ ♛ ♛;
Rook Black ♜ ♜ ♜;
Bishop Black ♝ ♝ ♝;
Knight Black ♞ ♞ ♞;
Pawn Black ♟ ♟ ♟;
Maths
Infinity ∞ ∞ ∞;
Plus Minus ± ± ±;
Name Preview Code
LessThan Or Equal To ≤ ≤ ≤;
MoreThan Or Equal To ≥ ≥ ≥;
Not Equal To ≠ ≠ ≠;
Division ÷ ÷ ÷;
Multiplication x × × ×;
Heavy Multiplication x ✖;
Superscript One ¹ ¹ ¹;
Superscript Two ² ² ²;
Superscript Three ³ ³ ³;
Circled Plus ⊕ ⊕ ⊕;
Circled Multiplication ⊗ ⊗ ⊗;
Logical AND ∧ ∧ ∧;
Name Preview Code
Logical OR ∨ ∨ ∨;
Delta ∆ ∆ ∆;
Pie ∏ ∏ ∏;
Sigma (SUM) ∑ ∑ ∑;
Omega Ω Ω Ω;
Empty Set ∅ ∅ ∅;
Angle ∠ ∠ ∠;
Parallel ∥ ∥ ∥;
Perpendicular ⊥ ⊥ ⊥;
Almost Equal To ≈ ≈ ≈;
Triangle △ △ △;
Circle ○ ○ ○;
Name Preview Code
Square □ □ □;
Fractions
One Quarter (1/4) ¼ ¼ ¼;
One Half (1/2) ½ ½ ½;
Three Quarters (3/4) ¾ ¾ ¾;
One Third (1/3) ⅓ ⅓ ⅓;
Two Thirds (2/3) ⅔ ⅔ ⅔;
One Eight (1/8) ⅛ ⅛ ⅛;
Three Eights (3/8) ⅜ ⅜ ⅜;
Five Eights (5/8) ⅝ ⅝ ⅝;
Seven Eights (7/8) ⅞ ⅞ ⅞;
Roman Numerals
Name Preview Code
Roman Numeral One Ⅰ Ⅰ Ⅰ;
Roman Numeral Two Ⅱ Ⅱ Ⅱ;
Roman Numeral Three Ⅲ Ⅲ Ⅲ;
Roman Numeral Four Ⅳ Ⅳ Ⅳ;
Roman Numeral Five Ⅴ Ⅴ Ⅴ;
Roman Numeral Six Ⅵ Ⅵ Ⅵ;
Roman Numeral Seven Ⅶ Ⅶ Ⅶ;
Roman Numeral Eight Ⅷ Ⅷ Ⅷ;
Roman Numeral Nine Ⅸ Ⅸ Ⅸ;
Roman Numeral Ten Ⅹ Ⅹ Ⅹ;
Roman Numeral Eleven Ⅺ Ⅺ Ⅺ;
Roman Numeral Twelve Ⅻ Ⅻ Ⅻ;
A few notes
There are some rendering differences between these symbols across operating symbols. This is caused by the
different font families that are used. Also, iOS and Android replace some Unicode characters with emoji, so be
sure to test there to make sure that this doesn’t happen and the icons show as intended. Have fun coding! :)
RESOURCES
Zine EOOD © 20092016