Collective #38
Inspiration Website of the Week
The Quintessential Magazine is this week's pick for their interesting design and interactive items.
Get inspiredMask Watch without Images
Based on this great concept by Filip Slováček, Tolga Ergin coded up this watch concept without using any images.
Read itFree Font: DHD Cool Skinny
Konrad Bednarski designed this beautiful, hand-drawn type called DHD Cool Skinny.
Get itBrand Identity Style Guides From Around the World
A great reference list of identity style guides from different companies and institutions around the globe.
Check it outSuperfreedraw: World's Biggest Online Drawing
Superfreedraw is the biggest drawing worldwide. No censorship. No rules. Enjoy the beauty of pure user-generated nonsense.
Draw something!ish. Viewport Resizer
Do we need another viewport resizer? Of course we do! Especially if it has a disco mode!
Check it outGarlic.js
Garlic.js allows you to automatically persist your forms' text and select field values locally, until the form is submitted. This way, your users don't lose any precious data if they accidentally close their tab or browser.
Try itContent Security Policy 1.0 is Officially Awesome
Great news about the Content Security Policy 1.0 specification which got the status of a candidate recommendation. It will allow reducing the risk of cross-site scripting and other content injection attacks in your applications.
Read itByPeople: A huge free bundle for web professionals
ByPeople off this incredibly big bundle with lots of useful templates and resources for free.
Get itResponsive Background Images with Fixed or Fluid Aspect Ratios
Rolf Timmermans explains how to scale background images correctly in browsers that don't understand background-size: cover
by using a padding technique.
High-Res Browser Logos
Remember those fantastic high-resolution browser logos by Paul Irish? Now you can get them from GitHub.
Check it outWhy I switched from LESS to Sass
Hugo Giraudel shares his experience with the CSS preprocessors LESS and Sass and explains why he chose to stick with Sass.
Read itMastering SVG Use for a Retina Web, Fallbacks with PNG Script
In this tutorial Todd Motto explains how we can link an SVG through an image element, providing PNG fallbacks with Modernizr and jQuery/JavaScript.
Read itFree Font: Geogram
Geogram typeface by Filiz Sahin is a new font exploration based on modern geometric shapes. The font contains lower case letters and numbers of the shapes.
Get itStairway Navigation (A jQuery Plugin?)
An interesting "stairway" navigation hover effect where the hovered item becomes the "tallest" stair.
Check it out100,000 Stars
The Google Data Arts Team created this stunning Chrome experiment: 100,000 Stars is an interactive visualization of the stellar neighborhood that shows the real location of over 100,000 nearby stars.
Explore itHand Cursors (PSD)
Claudio Guglieri offers these useful hand cursors that can come in very handy in your next design project.
Get itLight Kit (PSD)
Angelo Wellens shares his Light Kit PSD which contains a set of fancy lighting effects for images.
Get itCSS Wiggle
Hakim El Hattab created this mesmerizing experiment using CSS animations and the CSS blur filter.
Get hypnotizedCSS Swinging Panel Menu
Seth Abbott coded this CSS menu that uses keyframe animations to create a swinging panel effect for the sub-navigation.
Check it outA Comprehensive Collection of Free UI Kits & Templates
This is a very useful collection compiled by Web Appers. It contains a list of UI and template freebies found around the web.
Check it outFree Font: Wave me in
Another great font experiment by Filiz Sahin.
Get it