Collective #54
Inspirational Website of the Week
![Collective54_site](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_site.jpg?x86293)
Handsome is our pick this week. It's an elegantly designed website with a unique portfolio section that has some subtle transitions with shadows and lights.
Get inspiredMagicSuggest
![Collective54_magicS](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_magicS.jpg?x86293)
MagicSuggest by Nicolas Bize is an auto-suggest combobox with Bootstrap theme using jQuery.
Check it outBuilding A Better Responsive Website
![Collective54_betterresponsive](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_betterresponsive.jpg?x86293)
A great read about creating responsive websites and an adjusted workflow by Jeremy Girard.
Read itMixing Responsive Design and Mobile Templates
![Collective54_rwdmt](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_rwdmt.jpg?x86293)
Chris Coyier explains how a mixed mobile strategy can work for your site; with insights on the development of Codepen.
Read itDonuts
![Collective54_donuts](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_donuts.jpg?x86293)
Need some clean, subtly animated dashboard gauges? You might like Donuts, a jQuery plugin developed by by Mattia Larentis.
Check it outFree Font: Technik Mono
![Collective54_technikmono](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_technikmono.jpg?x86293)
Technik Mono is a complementary monospaced version of Technik typeface. Technik Mono 50 is available for free.
Check it outThe One Pixel Rule
![Collective54_onepixelrule](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_onepixelrule.jpg?x86293)
Meng To explains the importance of 1px and what the rule means for app design.
Check it outBetter Navigation Through Proprioception
![Collective54_navigation](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_navigation.jpg?x86293)
Some interesting insights on how to apply the concept of proprioception to create better navigation patterns by Cennydd Bowles.
Read itCorporate Identity Photoshop Mock-up (PSD)
![Collective54_cidentity](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_cidentity.jpg?x86293)
Bluegraphic released this clean and complete corporate identity mockup set for free.
Check it outBreaking down Amazon’s mega dropdown
![Collective54_amazon](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_amazon.jpg?x86293)
A very interesting look into the magic behind the fast drop-down menu of Amazon by Ben Kamens.
Read itdsgnjbs - All of the best design jobs in one place
![Collective54_jobs](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_jobs.jpg?x86293)
Tom Cavill developed this great site that shows design jobs from the best job sites out there.
Check it outFree Font: Supergrass
![Collective54_supergrass](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_supergrass.jpg?x86293)
Luca Ferrario shares this interesting and fun hand-drawn typeface for free.
Get itHorizontal centering using CSS fit-content value
![Collective54_fitcontent](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_fitcontent.jpg?x86293)
Learn about the experimental fit-content
value for widths in CSS and how it could become an interesting problem-solver.
Handy Icons Vol2 – Free Web Font Kit
![Collective54_handyicons](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_handyicons.jpg?x86293)
This resource includes 99 hand drawn icons that have been converted to a webfont for easy integration into your projects.
Get it:focus tooltip
![Collective54_tooltipfocus](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_tooltipfocus.jpg?x86293)
Some sweet tooltips folding out on focus of the input fields by Victor Pegado.
Check it outKoken: Creative website publishing
![Collective54_koken](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_koken.jpg?x86293)
Koken is a free system designed for photographers, designers, and creative DIYs to publish independent websites of their work.
Check it outMap Markers (PSD)
![Collective54_mapmarkers](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_mapmarkers.jpg?x86293)
Some really nice map markers by Gaston Figueroa.
Get itThe Foundation for Responsive Design – Flexibility
![Collective54_flexibility](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_flexibility.jpg?x86293)
Emily Lewis dives into the main foundations of responsive web design and explains how to employ flexibility.
Check it outFree Outline Icons
![Collective54_outlineicons](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_outlineicons.jpg?x86293)
A very useful set of almost 200 icons that come in handy for a wide variety of web and app design projects.
Get itFree Font: Corbert
![Collective54_corbert](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_corbert.jpg?x86293)
Jonathan Hill designed Corbert, a geometric sans serif typeface influenced by Bauhaus and the early modernist era. The regular and the italic styles are for free.
Check it outUsing SVG
![Collective54_usesvg](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_usesvg.jpg?x86293)
Learn how to use SVG in a web project from Chris Coyier. With some important facts and useful tips.
Read itFree Font: Astroman
![Collective54_astroman](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_astroman.jpg?x86293)
Astroman is an original and unique display typeface by Darren McArdel.
Check it out10 Business Card Templates (PSD)
![Collective54_businesscards](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_businesscards.jpg?x86293)
A great freebie release by Honkiat: 10 clean and modern business card templates.
Check it outFlat UI Blog (PSD)
![Collective54_flatuiblog](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_flatuiblog.jpg?x86293)
Riki Tanone has put together a set of blog widgets with a "flat" design.
Check it outMake your website printable with CSS
![Collective54_printcss](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2013/03/Collective54_printcss.jpg?x86293)
Responsive design isn't just about screen size; it also means adapting to different media – including print. Adrian Roselli shares some techniques in this .net article.
Read it