Menu Search
Jump to the content X X
Smashing Conf San Francisco

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Free Typographic XHTML/CSS-Layouts For Your Designs

In May we announced the Typographic Layout Design Contest1 that aimed to collect beautiful typographic (X)HTML+CSS-based layouts created by the design community and release them for free as a gift for the web design community. The response was overwhelming and we really had a hard time going through the designs, analyzing them and deciding which templates deserve the awards. Unfortunately, many templates were just copies of the current designer’s blog and some weren’t related to typography at all. So in the end many templates didn’t make it to this post.

However, we did receive a number of brilliant typographic templates that we are happy to release for free download and personal and commerical use as the gift for the web design community. We hope that these templates will help you to improve the quality of typography in your future designs!

Winner (1st place): T-20 Link

T-20 [ preview2 | download3 ]
"The Layout is following the rules of Grid-Based-Design and aesthetical and readable type. I also tried to make everything only with CSS. The Images have to be replaced – blank PSD-Files in different fitting sizes are also attached. I know you won’t take this but it was a good chance to try out some things I always wanted to make – and I will go on with this." Designed by Nikolaj Sokolowski4 from Bremen/Germany.

Type Layout For Free Download - T-205

Winner (2nd place): Extreme Georgia Link

Extreme Georgia [ preview6 | download7 ]
"I hand-in a single-page template for blogs. The title for this work is Extreme Georgia. It is 100% Georgia-based, and I am aware that it is a bit old-school. However, the design itselft reflect back the concept that I want to bring, which is, content is the king. I took into account the colors, whitespaces, line-height, font-size and also the content width for this design.

It might look plain, but it can be customized easily, let’s say, the color of the links, background image can be added later, and also the background colors. My work is heavily influenced by many designers, such as Jason Santa Maria, Jon Tangerine, Tim Van Damme, Khoi Vinh, and especially, the Georgia font which was designed by Matthew Carter. Without them, I wonder where could I be now in web design industry." Designed by Mohd Huzairy Mohd Rezuan from Kuala Lumpur, Malaysia.

Type Layout For Free Download - Extreme Georgia8

Winner (3rd place): Experimental Link

Experimental [ preview 19 preview 210 | download11 ]
"A minimal blog theme inspired in the Swiss Style of Design: It features Arial/Helvetica, grids, a generous use of whitespace for better readability and a strong focus in typography. The idea was to design an universal WordPress theme that’s focused on content and images, with an invisible, yet sleek design. Authors can modify the header as they wish, including images or playing with typography as in the example. this layout was coded using EMs, so it doesn’t break when you make text size changes in your browser. It’s an elastic design." Designed by Rodrigo Galindez from Argentina.

Type Layout For Free Download - Experimental12

Greenie Theme Link

Greenie Theme [ preview13 | download14 ]
"Greenie Theme is suitable for portfolio site, but can be used elsewhere where client needs to show his works. I used big typographic claim for catch users attention and other typo elements. Like its name, theme used fresh green color for main content page, and for background." Designed by Ondrej Lechan from Slovakia.

Type Layout For Free Download - Greenie Theme15

Shalom Typo Link

Shalom Typo [ preview16 | download17 ]
Designed by David Hellmann from Cologne, Germany.

Type Layout For Free Download - Shalom Typo18

O’No! Typography Link

O’No! Typography [ preview19 | download20 ]
"The idea behind the layout was to create something very simple, but very detailed and adaptable. Cufon is the driving force behind most of the type itself, even the body text, which means that it looks fantastic in all browsers – even ones which don’t usually bother to anti-alias. The adaptable-ness of the theme comes from the way in which the css classes are constructed. They’re designed to work together to form different boxes of text.

For example, the class=”box small left” would create a box spanning 1 column, with a background image to support the heading tag, and float to the left. A variation would be class=”big right” – which would create a box spanning 2 columns with no background image, float to the right, and eliminate any extra margins. This means that it’s really easy to adapt and change the layout to suit your needs, a few examples of which are included!" Designed by John O’Nolan21 from United Kingdom.

Type Layout For Free Download - O'No! Typography22

Typographic Times Link

Typographic Times [ preview23 | download24 ]
"This was mostly motivated by my desire to play around a bit with @font-face, which I don’t usually get to do. I stumbled upon a lovely imitation of Bembo at Font Squirrel and based a lot of the design off its italic (though it works fine with Georgia as well). I knew I wanted to try to do something very clean and restrained, and decided on a news blog–typography themed, of course–and went from there. I took inspiration from a number of places, most strongly from typographica.org25 (for the general page structure) and http://weblog.cynosura.eu26 (for the top navigation)." Designed by Evan Hensleigh27 from United States.

Type Layout For Free Download - Geotypisch template28

Geotypisch Link

Geotypisch [ preview29 | download30 ]
"Pure CSS and XHTML, no images, no JavaScript. Fonts used are Georgia and Arial. This template contains 2 example posts, one with comments, a comment form and a sidebar. Boxes are build using the 16 column 960 grid system. " Designed by Otto Coster31 from Netherlands.

Type Layout For Free Download - Geotypisch template32

Megan Link

Megan [ preview33 | download34 ]
"The basic idea behind this site design was to create a visually stimulating layout with typography. Because the site is to be used as a template I chose to layout the type in Times New Roman. I feel that as of lately I see the web-based font Georgia being used a lot and Times New Roman seemed to be a little more unique and has a lighter, more sophisticated feel. Also, keeping in mind that the design was for a template, I decided to make the background and type a neutral color and then accented it with a bold red/orange color.

I thought this way people could switch up their bold color to whatever they would like for easy customization. Another common theme carried out throughout the site design is the horizontal line element. This element is used in the navigation, to help break up blocks of information, and to underline words or links. Overall the idea was to create a template with an overall typographic foundation that could be easily customizable and I believe this design successfully does that." Designed by Megan Sullivan35 from Grand Rapids, Michigan, USA.

Type Layout For Free Download - Website Contest Entry36

Maintenance Link

Maintenance [ preview37 | download38 ]
"Maintenance pages are never something that a person wants to see. By adding more elements (such as a timeline, alternate entertainment, and contact information), the page will be more interesting to view and thus make someone more likely to come back when the site is back. The idea of making it look like a card made it seem more like a noticed posted on an office door by a secretary that was using whatever was lying around." Designed by Ryan King39 from United States.

Type Layout For Free Download - Maintenance 40

WP Typo Link

WP Typo [ preview41 | download42 ]
"WP Typo is purely typographic, no images used whatsoever. There isn’t any grand ideology here, it’s just a simple and hopefully nice looking theme for sites where writing is the focus." Designed by Chris Coyier43 from United States.

Type Layout For Free Download - WP Typo44

theARTofTYPE Link

theARTofTYPE Typography Blog Template [ preview45 | download46 ]
"A Very Light Blog Template. " Designed by Jan Harold Diaz from Philippines.

Type Layout For Free Download - theARTofTYPE Typography Blog Template47

David Kruger Link

David Kruger [ preview48 | download49 ]
Designed by David Kruger50 from Paraguay.

Type Layout For Free Download - David Kruger51

Top Notch Link

Top Notch [ preview52 | download53 ]
"I designed “Top Notch” as a template that would allow the end user feel like they were a part of a conversation." Designed by Garth Braithwaite54 from US.

Type Layout For Free Download - Top Notch55

Simple Type Link

Simple type [ preview56 | download57 ]
"A minimalistic & typographic layout, based on a 960 pixels grid system." Designed by Ahmed Chergaoui58 from Agadir, Morocco.

Type Layout For Free Download - Simple type59

Anticipated Link

Anticipated [ preview60 | download61 ]
"A simple typographic portfolio template. " Designed by Markus Müller62 from Stuttgart, Germany.

Type Layout For Free Download - Anticipated63

MiniCon Link

MiniCon [ preview | download64 ]
"Half minimalism and half contrasting colours, suited mainly for magazine type website but could be used for many other things too of course. My main inspirations were various WordPress themes and typography websites from smashing magazine’s collection of 100 wordpress themes for 2009 and It uses the 960 grid system CSS framework, Cufon text replacement and JQuery. The photos are from various free stock websites." Designed by Joe Brightwell65 from New Zealand.

Type Layout For Free Download - MiniCon66

The theme Link

Theme [ preview67 | download68 ]
Designed by Leo DINH from Vietnam.

Type Layout For Free Download - Theme69

Typo E-mag Link

Typo E-mag [ preview70 | download71 ]
"A nice typographic template, looks like a blog’s main page. Main features are: nice color scheme, nice typography, nice sidebar (some people like to say “widget ready”) and nice footer. I know that there are missing comments numbers, but who on the Earth does need comments? Main colors are #fff, #cfcfcf, #c40000, #666, and #444. Hope you like it. Yeah, and it’s my first template." Designed by Matej Grabovský from Czech Republic.

Type Layout For Free Download - Typo E-mag72

Luvbold Link

Luvbold [ preview73 | download74 ]
"Simple and clean layout with bold and characteristic fonts." Designed by Wojtek Konieczny75 from Poland.

Type Layout For Free Download - Luvbold76

Happy Go Try Link

happy-go-try [ preview77 | download78 | release post of the WordPress theme79 (thanks, Alex Denning) ]
"This theme is designed to be light-weight and flexible. It is based on a modified grid system. I believe it has potential for a number of types of websites. I’ve included the source .png file to make it easier for you to modify the color scheme as you see fit. No link-backs to my site are necessary, although I’d GREATLY appreciate if you’d email me a link to theme in action if you use it! Since it’s designed to be flexible, feel free to modify it to your needs and let me know how it works out!

I wanted to make my template light-weight and flexible. Standard HTML typography is used extensively to make it easy to edit, quick to load, and optimal for SEO. It’s based off of a modified grid to allow many different uses. In addition, I have included a rough fireworks source file to make it easier for users to change the color scheme. The name, happy-go-try, is an anagram of “typography” and is supposed to represent the light-weight, light-hearted approach I took with this simple, but flexible design." Designed by Tyler Dawson80 from Iowa City, IA, USA.

Type Layout For Free Download - happy-go-try81

Eastern Tales Link

Eastern Tales [ preview82 | download83 ]
"I wanted a simple theme that would rely less on graphics, and more on color layout and type to let the content stand out. I chose the paper background to create texture. After choosing one from, the texture reminded me of a paper made from elephant dung [called Elli Poo I think].

So then I thought of a line drawing motif for the generic logo. [hoping it would look letterpress..] The motif is another way of drawing ganesha, the elephant god. I hand drew ganesha using wacom graphire in Gimp app, on Mac OS X. I also hand drew the twitter bird directly on the tablet. I hand coded the files using text wrangler.

I kept the colors to a minimum [pink/black/white] to keep attention on the text. " Designed by Lakshmi Mareddy from India, presently in the US.

Type Layout For Free Download - Eastern tales84

Paivi K Link

Template Paivi_k [ preview85 | download86 ]
"The idea of the template was to design a simple but powerful look for my personal blog. I usually tend to provoke a bit in my blog (with a sence of humour), maybe sometimes not being so nice to things and people that I critizise. Therefore the blog’s name became “The ugly colors of me” – which indicades into the content: “the not so pretty thoughts of me “. The layout color theme also derives from the same reasons and therefore strengthen the impact. " Designed by Päivi Karjalainen from Finland.

Type Layout For Free Download - Template Paivi_k87

Better Web Readability Link

Better Web Readability [ preview88 | download89 ]
Designed by Vladimir Carrer90 from Verona, Italy.

Type Layout For Free Download - Better Web Readability91

CMYKolours Link

CMYKolours [ preview92 | download93 ]
"CMYKolours is a blog based website layout founded on the CMYK colour scheme, I feel it stands out for numerous reasons, I love trying to experiment with both creative typography and colour palettes. In this layout I feel I have achieved both. On a sidenote, this template will be available for free download on my blog as a wordpress skin." Designed by Dan Walker94 from UK.

Type Layout For Free Download - CMYKolours95

Goliath Link

Goliath [ preview96 | download97 ]
"A two-column blog-template with lots of white-space and big letters." Designed by Emanuel Kluge98.

Type Layout For Free Download - goliath99

Cornballs Link

Cornballs [ preview100 | download101 ]
"This is a simple, lazy design, sort of inspired by the famous Keep Calm and Carry On poster. It makes use of one exciting CSS3 features documented in a recent Smashing Magazine’s article about CSS columns. This is a special treat for users of Gecko and WebKit browsers, and don’t worry because it looks perfectly decent in browsers which don’t support this feature – IE6 is not going to go “pop”. Aligned to both a horizontal and vertical grid, each row of the latter being 24 pixels high. " Designed by Joshua Goodwin102 from England.

Type Layout For Free Download - Сornballs-template103

viCard Link

viCard [ preview104 | download105 ]
"viCard (Virtual Identity Card) is based on the idea presenting your (business) card in the web by answering three simple questions: who are you? how to contact you? how to follow you? You can share your contact information and your recent activity on Flickr, Twitter or Delicious. Integrated hCard, vCard, screen-, print- and mobile/handheld-friendly. Valid HTML 4.01 Strict and CSS 2.1." Designed by Simon Gattner106 from Berlin, Germany.

Type Layout For Free Download - viCard107

Typo Today Link

Typo Today [ preview108 | download109 ]
"The idea of this theme is newspaper layout. This theme is designed for blog or portfolio." Designed by Edwin Lunandy110 from Orlando, FL.

Type Layout For Free Download - Typo Today111

JavaScript Tricks Link

JavaScript Tricks [ preview112 | download113 ]
“I’ve decided to try my design skills that I’ve collected while working on that 2 positions and create practically my first comp for you contest. So, the main idea is about usign JS, PNG and aesthetic of ligatures and shapes that can be created with spaces/negative spaces of letter forms. Usign Cufon and some of JS functions together with CSS absolute positioning I make random compositions of such a forms with some other features. I’m trying to show that design should be transcend, something more than just sum of technologies and resources that were used. Hope my message will be clear. Fonts used for Cufon: Cardo98, Lacuna.”Designed by Siarhei Mardovich from Belarus.

Type Layout For Free Download - JavaScriptTricks114

Contrast Link

Contrast [ preview115 | download116 ]
"My aim as a designer is to keep it clean and simple but with a twist. Unnecessary mouse clicks is the worst and objects which doesn’t add anything goes right out of the window, so for me, designing this template has been a real challenge. To keep it simple but still change focus, from the actual content on to the shell of the web site. Therefore, I had to break some of my own ground rules.

01. One extra mouse click: In order to view the actual content you have to click at least two times, one to expand the category and one to go to the project page. I choose to do it this way because I wanted the user to get a overview when he/she enters the site and to give each project it’s own page to make permalinking easier and to give the project the right amount of focus.

Because the task was to focus on the typographic I choose to add some unnecessary typographic details, this to make the site feel more complete. Because of the focus on typography and the above mentioned unnecessary details and my Swedish design heritage I choose to tone down the colours and stick to just black and white. I’ve exclusively used arial as the font, in different sizes, upper and lower case, and in different kering. This because I wanted to stick with a web safe font, and this where also a challenge, to make a web safe font become interesting, to make it stand out.

I choose to make a wordpress template just because I think wordpress is a very powerful tool to use these days. The target group for the template is someone who wants a portfolio or a smaller company that wants to showcase their work. Theme made for Smashing Magazine Typographic Layout Design Contest." Designed by Paul Linder117 from Sweden.

Type Layout For Free Download - Contrast118

Brown Typo Link

Brown Typo [ preview119 | download120 ]
"Do you love brown? Brown Typo is based on simplicity and brown." Designed by Vincenzo Milone from Italy.

Type Layout For Free Download - Brown Typo121

Exploring Web Typography Link

Exploring Web Typography [ preview122 | download123 ]
Designed by Matthew Taylor.

Type Layout For Free Download - Exploring Web Typography124

Ihsanrama Link

Ihsanrama [ preview125 | download126 ]
"My design is just want people hear what I am saying. So I called that “Ihsanrama says”.
You know.. just like in the movie Die Hard 3 there is man name Simon, always said : “Simon says…”." Designed by Ihsan Satria Rama127 from Indonesia.

Type Layout For Free Download - Ihsanrama says128

Blue Inc Link

Blue Inc [ preview129 | download130 ]
"My template is called “Blue Inc” because it was designed for use on a corporate website and the dominant color used is blue. It is a grid based design, but, as I didn”t want to take the time to decipher someone else’s grid system and since I figured the template should be completely original, I wrote my own grid system with perfect vertical rhythm." Designed by Kyle Wall131 from United States of America.

Type Layout For Free Download - Blue Inc132

Whoo! Link

Whoo! [ preview133 | download134 ]
"The template has as content the lyrics to The Rapture’s “Whoo! Alright yeah… uh huh”, so it’s a fun and light design." Designed by Victor Abadio135 from Brazil.

Type Layout For Free Download - Whoo!136

Worldlines Link

Worldlines [ preview137 | download138 ]
"Worldlines is a concept design for a News website. Mostly today’s news is treated differently from that of yesterday. Whereas in reality, most news stories span across days. The format we have designed gives the user a sense of where today and today’s stories, stand with respect to those of yesterday and so on, and at a glance.

The layout is designed so that it can be scanned and preview quickly. The color-coding and top navigation give the user control over what categories s/he wants to preview. The news items will be ordered according to importance and the stories published previously can be viewed by navigating to the particular date using the navigation at the bottom. And of course typography was our main focus area." Designed by Harshad Kulkarni, Sarang Norway and Sandesh Halarnkar139 from Bangalore, India.

Type Layout For Free Download - Worldlines140

Hot box Link

Hot box [ preview141 | download142 ]
"I have named my product (iron box) – ‘HOT BOX’. I chose iron box as my product ,as it has its own charcter (smooth ironing,wrinkle free clothes,crisp fabric etc.) & and which is seen by all daily.As I also did some research on Iron Boxes,very facinating. I just love the variation in grays & they are great for product site,. As it has the character (gray color ) strong presentation feel. The typo used is simple Arial font.Product on the page is dipicted with the features of the product, which is the main high light of the site." Designed by Smitha Patwardhan143 from Bangalore, India.

Type Layout For Free Download - HOT BOX144

Safe As Houses Link

Safe As Houses [ preview145 | download146 ]
"As you can see my inspiration was to create a simple, adaptable template using only web safe fonts as I think there is a lot than can be done with them structurally and within css without always having to use other replacement techniques. I had hoped to port it into a wordpress theme (and still plan to) but didn’t have time before this deadline.

I should also point out that although the XML file does produce validation errors these are from the Twitter and Flickr scripts (both are from the official sites) in the footer and not the template itself.." Designed by Susan Pierce Sloan147.

Type Layout For Free Download - Safe As Houses148

ILuvType Link

ILuvType [ preview149 | download150 ]
"ILuvType is a clean, typographic heavy theme that uses simple device fonts as a design element to create a clean, easy on the eyes, high contrast reading environment. The theme includes 4 page templates and a series of 5 different highlight colour schemes. The theme validates as HTML5 – it uses a small amount of Javascript and Jquery to achieve the necessary effects." Designed by Alex Holt151 from United Kingdom.

Type Layout For Free Download - ILuvType152

Pink Elephant Link

Pink Elephant [ preview153 | download154 ]
"This template is all about keeping the layout simple and functional while obtaining an aesthetic and rather original look. My primary source of inspiration was, and resources used includes an article on CSS-tricks about RGBa browser support. " Designed by Bjørn Friese155 from Denmark.

Type Layout For Free Download - Pink Elephant Solutions156

Smash My Typo Link

Smash My Typo [ preview157 | download158 ]
"My goal was to create a blog page with lots of text but still having a good amount of white space. I was aiming for some kind of media blog directed to young adults. First I wanted to create an ajax interface dynamically fetching news from rss feeds and videos from vimeo. But as I saw the contest just a few days before deadline, I realized there was not enough time. I am planning on creating the javascript files later as an addon to the theme.

The text in the blog posts are done like in print for books; Justified text with the first paragraph not being indented, but the rest of the paragraphs has text-indentation. This is done instead of separating the text with line-spacing. The reader does not get interupted by recurring gaps in the text and gets a smooth reading as when reading books.

I have a lot of Ideas of how to improve this template, but there is just no time. Creation Time: Design 9h, CSS 9h, Total 18h." Designed by Alexander Dahlberg159 from Sweden.

Type Layout For Free Download - Smash my Typo160

TypoGra Link

TypoGra [ preview161 | download162 ]
"TypoGra is more of a standard blog layout. I tried keeping everything as simplistic as possible (there are 2 images in total)." Designed by Gary Simon 163 from USA – Ohio.

Type Layout For Free Download - TypoGra164

Goldrenrod Link

Goldrenrod [ preview165 | download166 ]
"A special typographic template for businesses.
My immediate thought upon hearing about this contest was how well a typographic website design could work for a small business. I’ve found from my experience that small business websites are usually text heavy but not really graphic oriented and don’t have a need of bells and whistles like login systems, e-commerce, forums, etc. With that in mind, my goal was to create an interesting yet simple website design a small business could use while relying on text to really do the selling.

I also wanted the design to be easily modifiable to allow for just about any type of business, so the only really distinct elements are the logo, the image on the front page and the slight texture on the footer. In addition, I thought that many companies could use a place to show off their work, especially if they’re service oriented- hence, the showcase section. I hope you like it!" Designed by Lindsey Devlin167 from USA.

Type Layout For Free Download - Goldrenrod168

An Ordered Aesthetic Link

An Ordered Aesthetic [ preview169 | download170 ]
"This is a very clean, typographic, and minimal template based on the “960 grid”. I wanted to create a functional theme where everything had a purpose. In doing so, the end result was an orderly, uncluttered, thus eye-pleasing design.

I wanted to create a functional theme where everything had a purpose. In doing so, the end result was an orderly, uncluttered, thus eye-pleasing design. Also, I included an alternate stylesheet in the CSS folder for a darker version of the theme. I like the lighter version much more, but it is there if anyone wants to use it. " Designed by Greg Ponchak171 from USA.

Type Layout For Free Download - An Ordered Aesthetic172

Dynamic-Fresh Link

Dynamic-Fresh [ preview173 | download174 ]
"I wanted to create a very simple layout using only Helvetica as a typeface and a simple greyscale colour scheme. This would be good for anyone wanting to show off their work with pride and in a stylish but minimalistic way." Designed by Matthew Kempster from Milton Keynes, England (United Kingdom).

Type Layout For Free Download - Dynamic-Fresh175

Thank you! Link

Congratulations to the winners of the contest – Nikolaj Sokolowski (Bremen, Germany), Mohd Huzairy Mohd Rezuan (Kuala Lumpur, Malaysia) and Rodrigo Galindez (Argentina) have already been contacted. We express sincere gratitude for all the great work of the designers who were featured in this post or submitted their work for this contest. We really appreciate your efforts and your good intentions! Thank you very much and please join in next time – more contests are coming soon!

Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
  39. 39
  40. 40
  41. 41
  42. 42
  43. 43
  44. 44
  45. 45
  46. 46
  47. 47
  48. 48
  49. 49
  50. 50
  51. 51
  52. 52
  53. 53
  54. 54
  55. 55
  56. 56
  57. 57
  58. 58
  59. 59
  60. 60
  61. 61
  62. 62
  63. 63
  64. 64
  65. 65
  66. 66
  67. 67
  68. 68
  69. 69
  70. 70
  71. 71
  72. 72
  73. 73
  74. 74
  75. 75
  76. 76
  77. 77
  78. 78
  79. 79
  80. 80
  81. 81
  82. 82
  83. 83
  84. 84
  85. 85
  86. 86
  87. 87
  88. 88
  89. 89
  90. 90
  91. 91
  92. 92
  93. 93
  94. 94
  95. 95
  96. 96
  97. 97
  98. 98
  99. 99
  100. 100
  101. 101
  102. 102
  103. 103
  104. 104
  105. 105
  106. 106
  107. 107
  108. 108
  109. 109
  110. 110
  111. 111
  112. 112
  113. 113
  114. 114
  115. 115
  116. 116
  117. 117
  118. 118
  119. 119
  120. 120
  121. 121
  122. 122
  123. 123
  124. 124
  125. 125
  126. 126
  127. 127
  128. 128
  129. 129
  130. 130
  131. 131
  132. 132
  133. 133
  134. 134
  135. 135
  136. 136
  137. 137
  138. 138
  139. 139
  140. 140
  141. 141
  142. 142
  143. 143
  144. 144
  145. 145
  146. 146
  147. 147
  148. 148
  149. 149
  150. 150
  151. 151
  152. 152
  153. 153
  154. 154
  155. 155
  156. 156
  157. 157
  158. 158
  159. 159
  160. 160
  161. 161
  162. 162
  163. 163
  164. 164
  165. 165
  166. 166
  167. 167
  168. 168
  169. 169
  170. 170
  171. 171
  172. 172
  173. 173
  174. 174
  175. 175

↑ Back to top Tweet itShare on Facebook


Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops, online workshops and loves solving complex UX, front-end and performance problems in large companies. Get in touch.

  1. 1

    GORGEOUS! i love the first one so much! good job everyone!!!

    there were one or two where swear i’ve seen it before would’ve liked to see something more original designs but overall i think everyone did an amazing job!

  2. 2

    Sweet and Simple….Nice Collection !! My favorite is “O’No! Typography”

    DKumar M.

  3. 3

    My design didn’t make the top count, but it’s nice to see it on =]

  4. 4

    greenie rocks ! nice collection :-)

  5. 5

    Nice Collection

  6. 6

    Best post ever!!

    Well.. maybe not ever, but I’m a huge fan of Typo layouts.

    Love it!

  7. 7

    NOW. what would i do without SM?

  8. 8

    Daine Moodah

    July 8, 2009 9:47 am

    sehr sehr nett! :)

  9. 9

    Some nice elements here and there, but I must admit, overall I’m a little disappointed.

  10. 10

    OMG! w00t w00t w00t to Extreme Georgia by Mohd Huzairy!!!

    u rock bat!!!

  11. 11

    What a great selection of designs, congratulations to the winners and to those featured.

  12. 12

    Ryan Glover

    July 8, 2009 10:21 am

    Great collection of designs. I’d have to say my favorites are:

    The Art of Type
    David Kruger
    Typo E-Mag
    Brown Typo

    Thanks for the solid inspiration and layouts!

  13. 13

    Experimental is absolutely tremendous! (:

  14. 14

    Congrats to the winners, these are some really nice themes! Can’t wait for the next contest.

  15. 15


    July 8, 2009 10:27 am

    thanks SM team for publishing my layout!! I designed David Kruger
    I’m very happy about this!! and the winners made excellent work!! congratulations for every one who participate in this contest!!

  16. 16

    Excellent results for a well thought out competition, well done to all the entrants, especially the winners! and well done too Smashing!

  17. 17

    Absolutely beautiful! Can’t wait to try using these in some of my web designs!

  18. 18

    Some of these are truly fantastic; I think you picked the right winner. Thanks for running this contest.


  19. 19

    Nikolaj Sokolowski

    July 8, 2009 10:41 am

    Hi Everybody,
    I can´t say how happy and surprised I am to be the Winner here – I really didn´t expect that! But I have to say there are others that could be in my place too – I think the differences are really minimal.
    Thanks to everybody here and especially to the SM-Team who makes the creative juices flow on by delivering usefull information and constant inspiration.

  20. 20

    Mohd Huzairy

    July 8, 2009 10:43 am

    Dear SM, thanks for accepting my submission(Extreme Georgia) and made it into the list. I am really honored.

    And congratulations to Nikolaj Sokolowski for being the 1st winner. Your works is truly amazing!


↑ Back to top