Bi-Weekly Frontend News

Collective #6



Envision.js is a library for creating fast, dynamic and interactive HTML5 visualizations. It is a rewrite of HumbleFinance, a library for HTML5 canvas finance visualization.

Get it

Awesome Free Fonts


Mun typeface by Vincenzo Vuono

Awesome Free Fonts


Flexo Caps DEMO by Ben Blom

Awesome Free Fonts


Bounce by Ryan Maelhorn

Awesome Free Fonts


Amboss by Andreas Siess

Awesome Free Fonts


Henry by Marta Podkowinska

Awesome Free Fonts


Foro Extra Light by Hoftype

Awesome Free Fonts


Sofia Pro by Mostardesign

Responsive & Retina Content Images using simple CSS & a spacer PNG*


Matt Stow shows us how to to use a trick for loading the right-sized images using a spacer PNG.

Get it

Happy Easter!


Maryna Aleksandrova gives us some adorable Easter greetings with this CSS3 animation of "dancing" eggs! Don't forget to turn on your sound.

Check it out

On Responsive Images

Chris Coyier talks about some possible approaches for serving inline images on websites – the responsive way. Interesting pros and cons and of course, followed by a fruitful discussion.

Read it

Micro Icon Set


Matt Gentile gives us this set of 110 vecor icons.

Get it

Responsive Layouts, Responsively Wireframed


An interactive experiment with responsive design techniques using simple layout wireframes.

Check it out

Pure CSS Tool Tips Revisited


Louis Lazaris perfectionizes CSS tooltips and shows us how we can create a better, bulletproof solution.

Read it

Unquoted Font Family Names in CSS


Understand some very interesting facts about font names in CSS, what's valid and what not and when you can drop the quotes.

Read it

WReader Code Lab


If you want to learn how to create modern web applications, this might just be the course for you. With a set of exercises you can dive into all the latest development techniques and design fundamentals.

Do it



This jQuery slider/slideshow comes with a handful of interesting effects and a really useful generator that allows for a custom build of the script.

Get it



WebPutty is a simple CSS editing and hosting service that gives you a syntax-highlighting CSS editor you can use from anywhere, the power of SCSS and Compass, a side-by-side preview pane, and instant publishing with minification, compression, and automatic cache control.You can't create a new account anymore but you can get your own copy of WebPutty since it's been made open source.

Get it

Style Tiles


Samantha Warren shares a remarkable new design process approach with us: Style Tiles. She suggests that the current way of creating too detailed designs for clients can be replaced by the process common in architecture or interior design, a process that will convey just the right amount of the idea to the client. Make sure to also read this in order to have a better picture of what Style Tiles can look like.

Get it

Jigsoar Iconset


Jigsoar is a free icon set with 60 vector shapes for your next web development project. It is licensed under the Creative Commons Attribution 3.0 License.

Get it

Mobile Navigation Design & Tutorial


Learn how to tackle the challenges of a responsive navigation and create a mobile navigation with jQuery in this tutorial.

Read it



A lightweight plugin for kinetic-drag on mobile devices and the desktop (click & drag). It uses jQuery's animate functions along with CSS3 animations and it has built-in support for custom start, stop, and drag events; a debugger and the ability to customize your own kinetic easing functions.

Get it

HTML5 Drag and Drop... with real upload

Remy Sharp shows us how to "drag-and-drop and upload" but with the actual upload part.

Read it