Walt’s Unicode Viewer

View any range of Unicode characters in any font

↩ Return to Walt’s Home Page ↩

Read these instructions before proceeding:

Walt’s Unicode Viewer allows you to see any contiguous set of UTF-8 glyphs in any color, style and contrast combination using common CSS3 styling. This allows you to better predict how a font will appear in any language or color context.

To see examples of the glyph in all five generic CSS3 fonts along with the glyph’s major Unicode properties, click on the blue decimal/hex value below the glyph. A window with Unicode properties for the glyph will appear. This does not apply to the table of national flags.

Note that Walt’s Unicode Viewer can only display fonts that are installed in this device and are available to this web browser. For example, it cannot display Adobe dynamic fonts that are activated but available only via CSS @import directive or an HTML <link> element such as <link rel="stylesheet" href="https://use.typekit.net/jzqpi8uap.css">.

Choose viewing options from the “Typography & Viewing Options” menu and then click on Submit. You can change one or more options any time, but none will take effect until Submit is clicked.

The sample type option will display a pithy English sentence that uses many common Latin Basic characters with your chosen typographical options, and displays the corresponding CSS3 coding that can be copied and pasted into an HTML document.

All tables and viewing results will appear below the “Typography & Viewing Options” menu. The table is presented in 16-column hexadecimal format, with hex and decimal values included beneath each glyph.

If an HTML named entity (such as &eacute;) is shown in a table of glyphs, hover over the dark green HTML name to see ISO’s official description of the character.

Emoji symbols (and components of their older multicharacter cousin emoticons) are spread throughout the Unicode table, so there is no such thing as a single contiguous set. However, there’s a convenient option to see the complete table of Emoji national flags, which are programmed differently than most other glyphs.

Important Terminology
alphabet
A writing system in which both consonants and vowels are indicated.
block
A grouping of related glyphs within the Unicode encoding space used for organizing code charts. For example, Greek characters are grouped in a block called Greek and Coptic.
character
A letter or ideogram, consisting of one or more glyphs.
CJK
Chinese-Japanese-Korean glyphs. Ideograms shared by all three written languages, and used by many more spoken languages.
code point
A point on a grid of characters defined by the intersection of two decimal or hex values. The user’s web browser interprets the two values to ascertain the correct glyph.
This system is most commonly used in the Unicode national flags, which use the two-letter ISO 3166 country code (MX = Mexico, for example) and a special set of alphabet characters. M = 🇲 and X = 🇽, and when those two character values (&#127474;&#127485;) are concatenated and copied into a web page, the correct flag appears:
&#127474;&#127485; = 🇲🇽
Code points are useful for managing blocks of related glyphs that undergo frequent changes and can be expressed as points on a multi-dimensional grid.
CSS3, CSS
A simple mechanism for adding style (e.g., fonts, colors, spacing) to HTML and XHTML web documents. The latest version, CSS3, greatly expanded the typographical options available to web designers.
decimal, hexadecimal, hex
The two numbering systems used in web page design and Unicode; hexadecimal is frequently referred to simply as hex. Decimal is base 10 (0–9) and hex is base 16, with letters substituting for the higher digits (0–F). For example, 40,00010 = 9C4016.
The values can be used interchangeably on web pages by placing an x prefix on hexadecimal values: decimal &#8727; = hex &#x2217;
Hex is often favored by web designers because large hex numbers can use fewer digits than the same large decimal number, and some shortcut notations such as %20 (the space character, which is 3210) require only hex values. Both decimal and hex values can be used on this web page.
dingbat
A symbol (such as ¶ or •) used to highlight lists or act as graphic elements to separate sections of text. Unicode has several blocks of characters suitable for use as dingbats.
emoji
(1) The Japanese word for “pictograph.” (2) Certain pictographic and other symbols encoded in the Unicode Standard that are commonly given a colorful or playful presentation when displayed on devices.
emoticon
A symbol (such as 😊) added to text to express emotional affect or reaction — for example, sadness, happiness, joking intent, sarcasm, and so forth.
Emoticons are sometimes expressed by a conventional kind of “ASCII art,” using sequences of punctuation and other symbols to portray likenesses of facial expressions. In Western contexts these are often turned sideways, as :-) to express a happy face. Emoticons of all types are frequently presented as a subset of Emoji.
entity (or HTML entity)
A character or glyph encoded to appear correctly in a web browser. The format is:
&[name | hex or decimal value];
Example:
Low asterisk = named entity &lowast; = decimal &#8727; = hexadecimal &#x2217; = ∗
flags (subset of Emoji)
Emoji national flags are spread over 676 possible code point values. The Unicode code point for any national flag can be derived from the two-letter ISO 3166 country code. Example:
US = &#x1F1FA;&#x1F1F8; = 🇺🇸
font
A set of type of one style and size. A typeface (such as Helvetica) consists of one or more fonts, such as Helvetica Bold Italic.
The typeface designer will assign a Unicode number to each glyph or, in some cases (as with ligatures and accented characters) indicate that one or more characters will substitute for a special sequence of Unicode characters.
By adhering to Unicode and ISO/IEC 10646 specifications when assigning characters in a font, typeface designers and web browsers will consistently display the correct typography for any written language.
glyph
Any visible letter, accent mark, punctuation mark, icon, symbol, etc.; one or more glyphs can be used to define a character.
ideograph, ideograms
Writing systems in which each symbol conveys meaning, such as 𠅘.
ISO/IEC 10646
The character encoding standard (“Information technology / Universal coded character set”) maintained by ISO in synchronization with the Unicode Standard.
ISO/IEC 3166
The offical list of country codes, which are used to assign Unicode to national flag icons.
Note that not all country codes correspond to a flag; also, some flags correspond to entities that are not true country codes, but are instead given special status by ISO such as FX for Metropolitan France, even though FR is assigned to France. In both cases, device manufacturers and software providers such as Apple, Google and Samsung, have the option of including or excluding special status flag glyphs.
ISO
International Standards Organization, also known as ISO/IEC.
kerning pair
Two letters that are shaped so that font designers can move them close together without touching; common examples in English are WA and VA. Kerning pairs are provisioned in font designs, not unique Unicode glyphs, since the shapes of the letters control their possible pairing.
ligature
Two or more letters that are shaped so that font designers can create a unique single unit with all letters touching; common examples are fi and ffl.
Ligatures are generally provisioned by font designers, not unique Unicode glyphs, but a few of the more common ligatures are part of the Unicode Alphabetic Presentation Forms block of characters.
The provision of ligature combinations in fonts depends entirely on the overall artistic design of the alphabetical characters.
The ampersand (&), derived from the Latin word “et”, is a unique Unicode glyph and perhaps the most frequently seen and recognizable ligature, often substituting for “and” in logos and company names.
typeface
A particular style of typographic lettering, given a name (such as Baskerville) to distinguish it. Typically, one to several dozen fonts (such as Baskerville Bold Italic or Baskerville Condensed) comprise a typeface. The entire package of fonts may be called a family. Unicode has no artistic role in the designs of typefaces.
Unicode
The universal character set of most modern written languages and common symbologies (such as emoji and national flags). It is standardized and maintained by an ongoing consensus of software and hardware designers; typeface foundries; web site designers and programmers; academics; and other interested parties.
Unicode is the lingua franca of typography on the World Wide Web, allowing any Unicode-encoded HTML web page to be parsed and seen correctly by any Unicode-compliant web brower or AI system, regardless of the native languages of the sender and the recipient. Both the programming and the content (a story, say) of a web page can use Unicode.
Unicode Consortium
The umbrella organization that adminsters Unicode and Emoji.
UTF-8
Multibyte encoding for text that represents each Unicode character with 1 to 4 bytes, and which is backward-compatible with ASCII. UTF-8 is the predominant form of Unicode used in web pages.
W3C, World Wide Web Consortium
The umbrella non-profit standards organization for the World Wide Web, which is the collective name for all of the world’s web sites. W3C’s WebFonts Working Group is the primary force behind standardizing web site typography.
WYSIWYG
[whiz–ee–wig] What You See Is What You Get, a type of page layout program that uses a graphic interface to hide underlying HTML and CSS coding, including typographical CSS, from the page designer.

Source: Extracts from Unicode’s “Glossary of Unicode Terms”


Typography & Viewing Options

OR

OR

You previously selected the Basic Latin-ASCII block of glyphs. There are 128 glyphs in the block.

If Hex and Decimal values are provided, only decimal will be used.

If an ISO Character Block is specified, its settings take priority.


Default is “128.” You are currently using 128.


Default is “serif.” You are currently using serif.


Default is “normal.” You are currently using normal.


Default is “normal.” The bigger the number, the bolder the characters if the font supports it. You are currently using normal.


Default is “xx-large.” You are currently using xx-large.


Default is “normal” You are currently using normal.

*This option uses the font-stretch property. Sayeth the W3C: “When a face does not exist for a given width, normal or condensed values map to a narrower face, otherwise a wider face. Conversely, expanded values map to a wider face, otherwise a narrower face.”


(You previously selected the default normal setting, which disables historical font variants.)





Selecting the “knockout” option below will supercede these settings.


Optional Odd ’n’ Ends

If a box is pre-checked, the option is already active:

 
 
   
None
/* This CSS3 code produced the sample type above */

	background-color: white;

	color: black;

	font-family: serif;

	font-size: xx-large;

	font-stretch: normal;

	font-style: normal;

	font-variant-alternates: normal;

	font-weight: normal;

Unicode Basic Latin-ASCII glyphs for serif typeface
(Decimal 32 to 159)
Hex→
Dec&Hex↓
0123456789ABCDEF
32
x20
SPC
&#32;
&#x20;

SPACE
!
&#33;
&#x21;


"
&#34;
&#x22;

&quot;
#
&#35;
&#x23;


$
&#36;
&#x24;


%
&#37;
&#x25;


&
&#38;
&#x26;

&amp;
'
&#39;
&#x27;


(
&#40;
&#x28;


)
&#41;
&#x29;


*
&#42;
&#x2A;


+
&#43;
&#x2B;


,
&#44;
&#x2C;


-
&#45;
&#x2D;


.
&#46;
&#x2E;


/
&#47;
&#x2F;


48
x30
0
&#48;
&#x30;


1
&#49;
&#x31;


2
&#50;
&#x32;


3
&#51;
&#x33;


4
&#52;
&#x34;


5
&#53;
&#x35;


6
&#54;
&#x36;


7
&#55;
&#x37;


8
&#56;
&#x38;


9
&#57;
&#x39;


:
&#58;
&#x3A;


;
&#59;
&#x3B;


<
&#60;
&#x3C;

&lt;
=
&#61;
&#x3D;


>
&#62;
&#x3E;

&gt;
?
&#63;
&#x3F;


64
x40
@
&#64;
&#x40;


A
&#65;
&#x41;


B
&#66;
&#x42;


C
&#67;
&#x43;


D
&#68;
&#x44;


E
&#69;
&#x45;


F
&#70;
&#x46;


G
&#71;
&#x47;


H
&#72;
&#x48;


I
&#73;
&#x49;


J
&#74;
&#x4A;


K
&#75;
&#x4B;


L
&#76;
&#x4C;


M
&#77;
&#x4D;


N
&#78;
&#x4E;


O
&#79;
&#x4F;


80
x50
P
&#80;
&#x50;


Q
&#81;
&#x51;


R
&#82;
&#x52;


S
&#83;
&#x53;


T
&#84;
&#x54;


U
&#85;
&#x55;


V
&#86;
&#x56;


W
&#87;
&#x57;


X
&#88;
&#x58;


Y
&#89;
&#x59;


Z
&#90;
&#x5A;


[
&#91;
&#x5B;


\
&#92;
&#x5C;


]
&#93;
&#x5D;


^
&#94;
&#x5E;


_
&#95;
&#x5F;


96
x60
`
&#96;
&#x60;


a
&#97;
&#x61;


b
&#98;
&#x62;


c
&#99;
&#x63;


d
&#100;
&#x64;


e
&#101;
&#x65;


f
&#102;
&#x66;


g
&#103;
&#x67;


h
&#104;
&#x68;


i
&#105;
&#x69;


j
&#106;
&#x6A;


k
&#107;
&#x6B;


l
&#108;
&#x6C;


m
&#109;
&#x6D;


n
&#110;
&#x6E;


o
&#111;
&#x6F;


112
x70
p
&#112;
&#x70;


q
&#113;
&#x71;


r
&#114;
&#x72;


s
&#115;
&#x73;


t
&#116;
&#x74;


u
&#117;
&#x75;


v
&#118;
&#x76;


w
&#119;
&#x77;


x
&#120;
&#x78;


y
&#121;
&#x79;


z
&#122;
&#x7A;


{
&#123;
&#x7B;


|
&#124;
&#x7C;


}
&#125;
&#x7D;


~
&#126;
&#x7E;


CTL
&#127;
&#x7F;

CONTROL
128
x80
CTL
&#128;
&#x80;

CONTROL
CTL
&#129;
&#x81;

CONTROL
CTL
&#130;
&#x82;

CONTROL
CTL
&#131;
&#x83;

CONTROL
CTL
&#132;
&#x84;

CONTROL
CTL
&#133;
&#x85;

CONTROL
CTL
&#134;
&#x86;

CONTROL
CTL
&#135;
&#x87;

CONTROL
CTL
&#136;
&#x88;

CONTROL
CTL
&#137;
&#x89;

CONTROL
CTL
&#138;
&#x8A;

CONTROL
CTL
&#139;
&#x8B;

CONTROL
CTL
&#140;
&#x8C;

CONTROL
CTL
&#141;
&#x8D;

CONTROL
CTL
&#142;
&#x8E;

CONTROL
CTL
&#143;
&#x8F;

CONTROL
144
x90
CTL
&#144;
&#x90;

CONTROL
CTL
&#145;
&#x91;

CONTROL
CTL
&#146;
&#x92;

CONTROL
CTL
&#147;
&#x93;

CONTROL
CTL
&#148;
&#x94;

CONTROL
CTL
&#149;
&#x95;

CONTROL
CTL
&#150;
&#x96;

CONTROL
CTL
&#151;
&#x97;

CONTROL
CTL
&#152;
&#x98;

CONTROL
CTL
&#153;
&#x99;

CONTROL
CTL
&#154;
&#x9A;

CONTROL
CTL
&#155;
&#x9B;

CONTROL
CTL
&#156;
&#x9C;

CONTROL
CTL
&#157;
&#x9D;

CONTROL
CTL
&#158;
&#x9E;

CONTROL
CTL
&#159;
&#x9F;

CONTROL

Contact:

Send comments and suggestions to walt@baranger.us