Wallpaper : Font Anatomy

Posted on Jul 6, 2009 in design, type | 106 Comments

wallpaperfontanatomy

For some time I have tried to get a reliable information about the individual parts of the characters of the alphabet. The anatomy of type if you like. It was not so easy to find online. Still I found some and then some in various books.

The problem however is I did not find any one source I was fully satisfied with. Each one had some names missing which the others had and so on..

I collected all this info together and put in one as complete as I could. A second problem was to find a typeface that included everything. I finally gave up. It’s really hard to squeeze everything in. The ones that seemed to fit the best like Times for instance I didn’t want to use and some I wanted to use didn’t have all the major part names.

I finally decided to use a two beautiful and also free fonts, Tallys and Museo by Jos Buivenga. Some of the definitions I put in are maybe on the borderline, but not seriously I think. Take for instance a look at the crossbar in the ffi-ligature. The name there is Crossbar or Hairline. In this font it’s not quite a hairline but closer to a crossbar. Also the terminal drop on the r. I am taking a little chance there – the definition probably has more of a drop form in mind.

Another little one: Where the definitions are two lines they are read from top down and then to right. This is to keep the definitions in columns and not to spread them directly over each letter. See, like the g in Typography; Loop refers to the g but Drop to next letter, r. I hope it is not too confusing.

Finally: Be my guest and download this Anatomy of Type in the form of a wallpaper or desktop picture which you can keep and use on your computer. Free, of course. I trust that you tell everyone where you got it.

You can download it here: Font Anatomy Wallpaper

106 Comments

  1. Twitted by Praesentieren
    09.07.2009

    […] This post was Twitted by Praesentieren […]

  2. Háttérkép: Font Anatomy | Blogzóna | VENTOSA kreatív stúdió
    24.08.2009

    […] háttérkép a font.is-tól a "Betű anatómia" […]

  3. Font Anatomy « SMELL WHAT I’M THINKING
    19.10.2009

    […] […]

  4. 50 Helpful Typography Tools And Resources - Smashing Magazine
    06.05.2010

    […] iPhoneThis reference table features all fonts that are available on iPhone, iPod Touch and iPad.Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or […]

  5. Wordpress Blog Services - 50 Helpful Typography Tools And Resources
    07.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  6. 50 Helpful Typography Tools And Resources | 
    07.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  7. 50 Helpful Typography Tools And Resources | DesignerLinks | Home to Web design news, jQuery Tutorials, CSS tutorials, Web Designing tutorials, JavaScript tutorials and more!
    07.05.2010

    […] iPhoneThis reference table features all fonts that are available on iPhone, iPod Touch and iPad.Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or […]

  8. TG Designer » 50 Helpful Typography Tools And Resources
    07.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  9. 50 Helpful Typography Tools And Resources | DeerflyDesigns
    07.05.2010

    […] Font Anatomy (Wallpaper) A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  10. 50 Helpful Typography Tools And Resources « Hindgrindr
    07.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  11. 50 Helpful Typography Tools And Resources | CMS Code
    07.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  12. Nils Norman Haukås
    08.05.2010

    Great piece of information design. I’ve only recently started seriously thinking about type, so having this wallpaper to glance at will certainly help me learn the concepts of type. Thanks man.

    Cheers from a Norwegian. ^^

  13. Easy Resources » Blog Archive » 50 Helpful Typography Tools And Resources
    12.05.2010

    […] Font Anatomy (Wallpaper)A nice overview of all typographic terms and subtleties. Do you know what an ‘arm’ or ‘beak’ is? Time to find out. […]

  14. creative inspiration | identity-focused design by heather parlato
    12.05.2010

    […] [image: sigurdur armannsson ] need help with your type anatomy? refer to each part of every letterform with accuracy, using this anatomy of type desktop graphic, free from font.is […]

  15. Lese Empfehlungen
    14.05.2010

    […] Wallpaper : Font Anatomy : font.is […]

  16. The Anatomy of Type | QuicklyCode - Cheat sheets and programming stuff
    29.05.2010

    […] An interesting wallpaper showing the individual parts of the characters of the alphabet. Link to original article […]

  17. admin
    22.06.2010

    A few comments that didn’t make is over when I moved the site:

    Thomas Corthals: Great wallpaper! But the word “Drop” seems to be misplaced. Is it available in other resolutions as well?

    My reply: Hi Thomas.

    What other resolution do you have in mind? I could make some. You can mail me directly: sigurarm@islenska.is

    The Drop: There are a few others who are “a bit” out of place. It’s the grid which could have been finer. I am going to open this up again and see if I can make it better. (the Drop belongs to the “r”. And “tittle” in the bottom row belongs to the i. The idea was that if the word was below it belonged either to a lower part of the glyph or to the next one.)

  18. Tweets that mention font.is » Wallpaper : Font Anatomy -- Topsy.com
    25.07.2010

    […] This post was mentioned on Twitter by Smashing Magazine, Otba Mushaweh, Dushyant Arora, typography247, monirom and others. monirom said: RT @smashingmag: Typography: Font Anatomy Wallpaper – http://bit.ly/94TLBy – Oldie, but goodie. […]

  19. Bryan Hardbarger, Hardbarger Design
    25.07.2010

    Funnily enough, I was searching for this very same thing. Many thanks for obviously saving me what would have been a headache! Well done!

  20. Graham Smith
    26.07.2010

    This is a great idea, really rather cool.

    I just wanted to mention that I feel it just needs a small amount of tweaking with the ‘labels’. On initial glances, the labeling seems a bit off. Now I know you have mention this in your post, and I can see where things are, but not everyone will read the ‘about’.

    I think if you can ‘tweak’ the labeling, then it will become instantly clear for those that are just starting out on their type travels.

    But as I said, this is an awesome idea and I love the actual design.

    Graham

  21. 50 Useful Tools and Resources For Web Designers - Smashing Magazine
    26.07.2010

    […] You may want to check out Good Web Fonts for the actual specimens of various legible screen fonts.Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual […]

  22. 50 Useful Tools and Resources For Web Designers » abdie.web.id
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  23. 50 Useful Tools and Resources For Web Designers | 
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  24. Wordpress Blog Services - 50 Useful Tools and Resources For Web Designers
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  25. 50 Useful Tools and Resources For Web Designers | Web Design Cool
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  26. TG Designer » 50 Useful Tools and Resources For Web Designers
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  27. 50 Useful Tools and Resources For Web Designers | Webreweries.com | Tips | Photoshop | Java | Illustrator | Dreamweaver | After Effects | Graphics | Animation | Design
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  28. admin
    26.07.2010

    @Graham Smith:

    Thanks Graham. Thanks for the comment. I agree that the labels are a little offset. Guess I tried too hard to maintain the original grid.

    After my vacation I am going to make a few variations because this is quite popular and people are also asking for higher resolution. In three weeks – not later :D

  29. 50 Useful Tools and Resources For Web Designers | subliminal-solutions.co.za
    26.07.2010

    […] Font Anatomy Wallpaper This wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  30. 50 Useful Tools and Resources For Web Designers | DesignerLinks | Home to Web design news, jQuery Tutorials, CSS tutorials, Web Designing tutorials, JavaScript tutorials and more!
    26.07.2010

    […] You may want to check out Good Web Fonts for the actual specimens of various legible screen fonts.Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual […]

  31. 50 Useful Tools and Resources For Web Designers | LionWebMedia.com
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  32. 50 Useful Tools and Resources For Web Designers | Programming Blog
    26.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  33. The Anatomy of Type Wallpaper – @sigurarm | RSS Lens
    27.07.2010

    […] via font.is […]

  34. ArticleSave :: Uncategorized :: 50 Useful Tools and Resources For Web Designers
    27.07.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  35. Pablo
    27.07.2010

    Very interesting post. Just a comment, the “Follow me” tab on the right side has a broken link.

  36. admin
    27.07.2010

    Thanks. Fixed the link. There was a typo in the link.

  37. Mister Benn
    28.07.2010

    Love it, but there is a typo in the poster:

    ‘Descretionary Ligature’

    should be

    ‘Discretionary Ligature’

  38. admin
    29.07.2010

    Thanks Mister Benn. Fixed this.

  39. 50 Useful Tools and Resources For Web Designers « Perfect WP
    30.07.2010

    […] Font Anatomy Wallpaper This wallpaper (1920×1200) covers the terminology of typography, showcasing indi vid ual parts of the char ac ters of the alpha bet. […]

  40. Herramientas online: Tipografía
    03.08.2010

    […] descargarlo desde aquí o ir a su pagina oficial. Web FontFont User Guide […]

  41. 走向云和山的彼端 |走向云和山的彼端
    03.08.2010

    […] Font Anatomy Wallpaper This wallpaper (1920×1200) covers the terminology of typography, showcasing indi vid ual parts of the char ac ters of the alpha bet. […]

  42. 50 Useful Tools and Resources For Web Designers « Om Net Solution
    03.08.2010

    […] Font Anatomy Wallpaper This wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  43. 50 Useful Tools and Resources For Web Designers | Creative Man Studio
    03.08.2010

    […] You may want to check out Good Web Fonts for the actual specimens of various legible screen fonts.Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual […]

  44. 50 Useful Tools and Resources For Web Designers | i know idea
    03.08.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  45. 50 Useful Tools and Resources For Web Designers | Logo Design Brisbane
    04.08.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  46. Typography « Claire mist.com
    04.08.2010

    […] Font Anatomy Wallpaper […]

  47. Tweets that mention font.is » Wallpaper : Font Anatomy -- Topsy.com
    05.08.2010

    […] This post was mentioned on Twitter by MindRefresher, Designer in Action. Designer in Action said: Wallpaper »The Anatomy of Type« http://bit.ly/dhHagW […]

  48. ROJO PIXEL: El mejor sitio de diseño del mundo
    06.08.2010

    […] Font Anatomy WallpaperThis wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  49. ♥ Font Anatomy Desktop « ♥
    17.08.2010

    […] found this via Smashing Magazine who found it via it’s home font.is. It’s super fantastic and super handy so here it is […]

  50. yoxx
    17.08.2010

    awesome work!

  51. FaceWord - 50 outils et ressources utiles pour les concepteurs Web
    25.08.2010

    […] Polices d’écran Anatomy Ce fond d’écran (1920 × 1200) couvre la terminologie de la typographie, mettant en valeur certaines parties des caractères de l’alphabet. […]

  52. Ye Ko
    21.09.2010

    Thanks!! It’s Useful

  53. 50 Useful Tools and Resources For Web Designers | Hardcore Graphics
    25.09.2010

    […] Font Anatomy Wallpaper This wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet. […]

  54. Free fonts and Free Knowledge about them | geronimo89.dk
    27.09.2010

    […] deviantART with his piece Typographic Anatomy. Another wallpaper with is more detailed can be found here by […]

  55. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers :Speckyboy Design Magazine
    07.10.2010

    […] 1280x800px (Blue) – 1280x800px (Red) – 1280x800px (Black) – 1280x800px (Green).Font Anatomy Wallpaper Download: 1920x1200px.SEO Wallpapers Think of it as a desk reference checklist that is always at […]

  56. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers | Programming Blog
    07.10.2010

    […] Font Anatomy Wallpaper […]

  57. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers « Free UK Web Design
    07.10.2010

    […] Font Anatomy Wallpaper […]

  58. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers- rampantdesigntools.com
    07.10.2010

    […] Font Anatomy Wallpaper […]

  59. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers :Speckyboy Design Magazine | Ispey Seo Expert
    07.10.2010

    […] Font Anatomy Wallpaper […]

  60. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers « Prasannah's Scribble
    08.10.2010

    […] Font Anatomy Wallpaper […]

  61. 15 Cheat-Sheet Wallpapers for Web Designers | websiteproblems.co.uk
    08.10.2010

    […] Font Anatomy Wallpaper […]

  62. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers | Typography Blog
    08.10.2010

    […] Font Anatomy Wallpaper […]

  63. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers | RohitPaul.net
    08.10.2010

    […] Font Anatomy Wallpaper […]

  64. Waldir
    09.10.2010

    What’s the license of this one? It would be a great addition to http://commons.wikimedia.org/wiki/Category:Examples_of_typography_terms and http://en.wikipedia.org/wiki/Typeface_anatomy :)

  65. admin
    11.10.2010

    @Waldir: Feel free to post it anywhere. The links you posted are nice.

  66. Useful Collection of Cheat-Sheet Desktop Wallpaper for Web Designers
    12.10.2010

    […] Font Anatomy Wallpaper […]

  67. Anatomie der Buchstaben, kostenloses A1 Poster | HiRes Squad
    12.10.2010

    […] http://font.is/2009/07/wallpaper-font-anatomy/ […]

  68. Must-Have Cheat Sheets for Web Designers | Programming Blog
    03.11.2010

    […] Font anatomy […]

  69. 40 Articles, Websites, Resources, Tutorials & Tools To Learn Typography
    15.11.2010

    […] Font Anatomy Wall­pa­per (1920 x 1200 JPEG Image) via Font.is […]

  70. I <3 Typography « Meg's Moments
    23.11.2010

    […] […]

  71. 8 Cheat Sheet Wallpapers for Designers and Developers » abdie.web.id
    16.12.2010

    […] The Anatomy of Type […]

  72. 8 полезных cheat sheet в виде обоев
    16.12.2010

    […] 4. Анатомия шрифтов. […]

  73. 8 Cheat Sheet Wallpapers for Designers and Developers | Logo Design Bangalore
    16.12.2010

    […] The Anatomy of Type […]

  74. Anonymous
    16.12.2010

    […] […]

  75. 8 Cheat Sheet Wallpapers for Designers and Developers | Programming Blog
    16.12.2010

    […] The Anatomy of Type […]

  76. 8 Cheat Sheet Wallpapers for Designers and Developers | Summit Design
    16.12.2010

    […] Keyboard Shortcuts Color Theory Quick Reference Poster Periodic Table of Typefaces The Anatomy ofType Web Accessibility Checklist TextMate Shortcuts jQuery1.3 Cheat Sheet WordPress Help SheetWeb Design […]

  77. diventato » 8 Cheat Sheet Wallpapers for Designers and Developers
    17.12.2010

    […] The Anatomy of Type […]

  78. 8 Cheat Sheet Wallpapers for Designers and Developers
    19.12.2010

    […] The Anatomy of Type […]

  79. 8 Cheat Sheet Wallpapers for Designers and Developers | TotallyWP
    21.12.2010

    […] The Anatomy of Type […]

  80. The Anatomy of Type [Wallpaper] | ChurchCreate
    30.12.2010

    […] wall paper that can help you remember the elements of type. Download, review, and memorize.[via Font.is]Related PostsAbout the Author /**/ John Saddington John is the Creative Engineer @ The 8BIT […]

  81. Font of knowledge: A collection of font resources → St. Eutychus
    31.12.2010

    […] It’s from Font.is. You can get it in wall­pa­per size here. […]

  82. Nihil
    05.01.2011

    Nice work!!!
    It would be awesome to get a pdf / vector-format for a print, is that possible?

  83. admin
    05.01.2011

    @Nihil: I am trying to find time to do a version 2 of this and in more sizes etc. I will consider your request.

  84. Waldir
    05.01.2011

    Hi, Sig­urður. I appreciate your generosity, but to have the file in Wikimedia projects it needs to be explicitly acknowledged as under a free license or in the public domain.

    A simple free license you may put it in is Creative Commons Attribution (CC-BY): anyone can reproduce and modify the work as long as they credit you as the original author. Do you think that’d work for you?

    In the meantime, I urge you to change the line “Copyright © 2004–2009. All rights reserved.” in font.is to a free license or at least add a note stating that the images are under a free license (CC-BY or others), so that permission explicit doesn’t need to be granted each time someone likes your work and wants to reuse or remix it :)

    Btw, I’m very much looking forward to the version 2 of this :D

  85. admin
    05.01.2011

    @Waldir

    Ok. No problem on my behalf. Just need a little time to check this out.

    on font.is Copyright: This comes with the Modern Clix theme I am using. I should add a line that explains further like you suggest.

    I’ll check this out soon as I can.

  86. admin
    05.01.2011

    @Waldir – and of course I should state somehow where I use pictures from Shutterstock or iStockphoto.

  87. Waldir
    05.01.2011

    @admin: “Just need a lit­tle time to check this out.”

    Sure, let me know once you have it sorted out. I’ll be looking forward to add this image to the category at Wikimedia Commons I linked to previously :) It sure will be of great help to anyone willing to learn typography terminology.

  88. 嗜睡的蚂蚁
    09.01.2011

    nice one !

  89. Humberto
    15.02.2011

    i like your work, i would like to translate it to spanish if you let me … you can publish it in you web page

  90. admin
    18.02.2011

    @Humberto

    By all means. I’ll put it in and put you in the credit list for the translation. It got to be good :D

  91. Humberto
    25.02.2011

    @admin
    that’s a yes?.
    if it is… i’m wondering if you can send me the source files to make me easier the translation =/
    …Greetings

  92. admin
    28.02.2011

    @Humberto

    Send me a mail at sigurarm@islenska.is

  93. 8 Cheat Sheet Wallpapers for Designers and Developers | Preukson
    08.03.2011

    […] The Anatomy of Type […]

  94. emvion
    05.05.2011

    Can I have the vector file, if there is any?
    Thank you in advance!

    @50 Helpful Typography Tools And Resources |  -

  95. The Anatomy of Type [Wallpaper] | Church Mag
    16.05.2011

    […] [via Font.is] […]

  96. 8 Cheat Sheet Wallpapers for Designers and Developers | GlamourHits
    22.05.2011

    […] The Anatomy of Type […]

%d bloggers like this: