Collective #71

View All

ElementTransition.js * CSS Balls * Voyeur.js * Free Fonts * 60fps Mobile App * 1000 Free Icons * Side Projects

Collective 71

Inspirational Website of the Week


This week's inspirational website "Flandria" is a beautiful example for presenting a typeface in a creative way.

Get inspired



A fantastic wrapper by Daniel Silver for our Page Transitions that allows you to use more than one animatable element per page and add transitions straight from HTML tags.

Check it out

CSS Balls


A fantastic tutorial on how to style circles to look like realistic spheres by Donovan Hutchinson.

Check it out

Designers’ Friend Ltd.


A very original approach to designing a website by showing it's source and making it interactive. A fantastic website by Andy Mathieson.

Check it out

Sizing (Web) components


Changing the size of a framework component isn't always easy but we surely need to do it quite often. Simurai suggests a technique that will make things easier: using EM units for every CSS property that has a direct impact on a component's size and then simply resizing the font size.

Read it



Voyeur is a very useful JavaScript library that lets you transverse and manipulate the DOM in a straightforward way.

Check it out

Long Shadow Generator


If you are enjoying the new long shadow trend and would like to try to design something with it, then this Photoshop style by GraphicBurger will come in very handy. It works with smart objects and is available for two directions at 45 degrees.

Get it

Making a 60fps Mobile App


Paul Lewis shares his experience and thoughts on building a mobile app that runs at 60fps.

Check it out

Ultimate Free Icon Set: 1000 Free Icons


A gigantic freebie created by for Six Revisions. It contains 1000 vector icons and it comes in PNG, EPS and AI.

Get it

Free Font: Morden


A very creative typeface following the current trends by Andrea Buttieri.

Get it



Sketchplantations will explain you one thing each day in a sketch. Learn some really interesting things by visual explanation.

Check it out

Side Projects


An awesome collection of side projects of designers and developers around the world. Maintained by Surjith SM.

Check it out

Height equals width with pure CSS


Marc Hinse shares his CSS-based solution for keeping the aspect ratio of elements on resize.

Check it out

A Few More Words on Accessible Dialogs/Modals


Hans Christian Reinl shares a function that allows tabbing through a modal dialog and keep the focus within the modal while it is active.

Read it

The Modular Canvas: A Pragmatic Workflow for Designing Applications


Gabriel O'Flaherty-Chan form Jet Cooper suggests a modular approach for a more efficient application design process.

Read it

Free Font: Puzzle font


Teresa Arroyo shares this interesting puzzle font for free. You can download an editable PDF and use it freely.

Get it

Progressive enhancement is still important


If you have seen the slides of Nicholas C. Zakas "Enough with the JavaScript already!" then you might be interested in Jake Archibald's thought on progressive enhancement.

Read it

Writing DRYer vanilla CSS


Harry Roberts gives some tips on how to write DRYer CSS by following the principle of avoiding repeating the parts of your CSS that are most likely to change.

Read it

Free Font: Mir Medium


Mir is a very interesting and unique typeface designed by Julia Sysmäläinen and you can get the medium weight for free.

Get it

Would you like to become a Collective sponsor?

You can sponsor a Collective issue with your own news item. Find out more.

Do you want to share some interesting news here?

The Collective features the latest news and resources from the web design & web development community. If you have spotted something that you'd like to appear in the next issue, just submit it here