Collective #157

Inspirational Website of the Week: Dogstudio
Our pick this week has a fantastic color scheme, some interesting effects and a great layout.
Get inspired
Chrome Experiment #1000
Be part of the 1000 Chrome experiments celebration with this awesome interactive visualization.
Check it out
Unicoder.js
Convert any text to fancy Unicode alphabet letters. A project by Tim Holman.
Check it out
The Nice and Serious UI Icon Set (AI)
96 elegant and clean icons by Nice and Serious.
Get it
Extending the Color Cascade with the CSS currentColor Variable
An in-depth article on the CSS currentColor variable and how to use it by Sara Soueidan on the Adobe Dreamweaver Team Blog.
Read it
Mini Camping Icon Set (AI)
A lovely icon set with a camping theme made by Justas Galaburda.
Get it
Free Font: Geomanist Regular
An elegant font family for a clean look designed by Atipo Fonts. The regular style is for free (pay with a tweet or like) and you decide the price for the whole family.
Get it
Create a halftone texture pattern in Illustrator
A tutorial by master illustrator Veerle Pieters on how to create a beautiful halftone texture pattern in Adobe Illustrator.
Check it out
Clocks
Donovan Hutchinson's in-depth tutorial on how to create clocks with CSS animations and JavaScript.
Check it out
Making and Faking Ordinals on Web Pages
Dudley Storey explains the several possible solutions for showing ordinals on a website.
Read it
Colorable
In case you missed it: Colorable is a color combination contrast tester that helps finding safe color combinations. Made by Brent Jackson.
Check it out
Secondary Sliding Navigation
A high quality resource from CodyHouse: a smart seconday sliding navigation by Claudia Romano.
Check it out
Stampsy
Besides showing off a stunning website, Stampsy allows for the creation of photo stories, mood boards, visual essays and more.
Check it out
Progressive Enhancement is not about JavaScript availability
Christian Heilmann reminds us what progressive enhancement really is.
Read it
Swiper
A modern mobile touch slider with hardware accelerated transitions and native behavior. Made by iDangero.us.
Check it out
Frontend stuff
A curated collection of useful tools and resources related to front-end development. By Moritz Klack.
Check it out
Up your CSS-Game with Math
Get creative with the nth-child selector and learn some tricks. An article by Patrick Goethe.
Read it
Modern Flat Preloader Set (GIF, AEP)
12 stunning animated flat preloaders that will give a special touch to your app. Made by Pixel Buddha.
Get it
CSS Space Shooter
Michael Bromley's old-school arcade-style 3D shoot-em-up implemented in CSS and HTML.
Check it out
Plyr
A gorgeous looking HTML5 media player with custom controls and WebVTT captions. By the folks from Selz.
Check it out
Free Font: XPLOR
Jimmy Kalman designed this unique and playful typeface and offers it for free.
Get it