view source

A set of variables providing CSS-friendly Unicode character-codes for the kinds of typographic glyphs you may find yourself adding to your stylesheets as content values.


Instead of looking them up every time, use a variable.

The names of these variables often correspond with HTML character entity references that you can use in your markup. For example, $scut-nbsp is the same character as   in HTML.


space ("\0020")
non-breaking space ("\00a0")

Quotation Marks

quotation mark ("\0022")
left single curly quote ("\2018")
right single curly quote ("\2019")
left double curly quote ("\201C")
right double curly quote ("\201D")
left single angle quote (guillemet) ("\2039")
right single angle quote (guillemet) ("\203A")
left double angle quote (guillemet) ("\00ab")
right double angle quote (guillemet) ("\00bb")

Other Punctuation

em dash (mutton) ("\2014")
en dash (nut) ("\2013")
hyphen ("\2010")
ampersand ("\0026")
paragraph symbol (pilcrow) ("\00b6")
middot (interpunct, interpoint) ("\00b7")
bullet ("\2022")
white bullet ("\25E6")
horizontal ellipsis ("\2026")
vertical ellipsis ("\22EE")
midline horizontal ellipsis ("\22EF")

Various Symbols

greater than ("\003e")
less than ("\003c")
times ("\00D7")
big times ("\2715")
checkmark ("\2713")
section sign (double S, hurricane, sectional symbol, the legal doughnut, signum sectiōnis) ("\00a7")
o-slash (slashed o) ("\00f8")


up-pointing triangle ("\25b2")
down-pointing triangle ("\25bc")
left-pointing triangle ("\25c0")
right-pointing triangle ("\25b6")
up-pointing small triangle ("\25b4")
down-pointing small triangle ("\25be")
left-pointing small triangle ("\25c2")
right-pointing small triangle ("\25b8")
diamond ("\25c6")
fisheye ("\25c9")
bullseye ("\25ce")
circle ("\25cf")
white circle ("\25cb")
square ("\25a0")
white square ("\25a1")
small square ("\25aa")
small white square ("\25ab")


currency ("\00a4")
cent ("\00a2")
dollar ("\0024")
pound ("\00a3")
euro ("\20ac")
yen ("\00a5")
rupee ("\20B9")