16 Gorgeous Web Safe Fonts To Use With CSS

I have gathered together a nice resource list of stunning web safe fonts that you can use with CSS stylesheets. “Web Safe” fonts mean that they will be extremely common on most versions of Windows, Mac, Linux etc, so they will be viewable by more a less everyone. Along with each font is a preview image of what it looks like, and the raw CSS code that you can copy and paste directly into your own stylesheet to use the font. If you have any others please drop in a comment.
Impact

impact
view source
print?
1..classname {
2.color: #333333;
3.font-family: Impact, Charcoal, sans-serif;
4.}

* * * * *
Palatino Linotype

palatino-linotype
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
4.}

* * * * *
Tahoma

tahoma
view source
print?
1..classname {
2.color: #333333;
3.font-family: Tahoma, Geneva, sans-serif;
4.}

* * * * *
Century Gothic

century-gothic
view source
print?
1..classname {
2.color: #333333;
3.font-family: Century Gothic, sans-serif;
4.}

* * * * *
Lucida Sans Unicode

lucida-sans-unicode
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
4.}

* * * * *
Arial Black

arial-black
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Arial Black', Gadget, sans-serif;
4.}

* * * * *
Times New Roman

times-new-roman
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Times New Roman', Times, serif;
4.}

* * * * *
Arial Narrow

arial-narrow
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Arial Narrow', sans-serif;
4.}

* * * * *
Verdana

verdana
view source
print?
1..classname {
2.color: #333333;
3.font-family: Verdana, Geneva, sans-serif;
4.}

* * * * *
Copperplate Gothic Light

copperplate-gothic-light
view source
print?
1..classname {
2.color: #333333;
3.font-family: Copperplate / Copperplate Gothic Light, sans-serif;
4.}

* * * * *
Lucida Console

lucida-console
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Lucida Console', Monaco, monospace;
4.}

* * * * *
Gill Sans

gill-sans
view source
print?
1..classname {
2.color: #333333;
3.font-family: Gill Sans / Gill Sans MT, sans-serif;
4.}

* * * * *
Trebuchet MS

trebuchet-ms
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Trebuchet MS', Helvetica, sans-serif;
4.}

* * * * *
Courier New

courier-new
view source
print?
1..classname {
2.color: #333333;
3.font-family: 'Courier New', Courier, monospace;
4.}

* * * * *
Arial

arial
view source
print?
1..classname {
2.color: #333333;
3.font-family: Arial, Helvetica, sans-serif;
4.}

* * * * *
Georgia

georgia
view source
print?
1..classname {
2.color: #333333;
3.font-family: Georgia, Serif;
4.}

No comments:

Post a Comment