Collective #401

Bringing interactive examples to MDN
Will Bamberg writes about how interactive examples were added to the MDN JavaScript and CSS reference pages.
Read it
A seamless way of managing work from start to finish
The Paymo App allows your small business to focus on your business - not your paperwork. Tracking your time, creating estimates and invoices is made simple using this App.
Try it free
Crunch
Crunch is a macOS tool for PNG image file optimization built on pngquant and zopflipng.
Check it out
Figma Platform
The Figma Platform enables apps, websites and internal tools to integrate directly with the realtime state of design in Figma from using a Web API and an open JSON format. Read more about it in this article.
Check it out
The Ultimate Guide to Background Images in Email
Jason Rodriguez explains why and how to use background images in an email campaign.
Read it
#SmooshGate FAQ
Mathias Bynens explains how a proposal for a JavaScript language feature called Array.prototype.flatten turned out to be Web-incompatible.
Read it
Check for support of CSS variables
Ire Aderinokun's trick to check if a browser supports CSS variables.
Check it out
Diversity Avatars (PNG, SVG, EPS, AI)
30 free icons from diversityavatars.com that capture the beauty and diversity of people and cultures around the world.
Get it
Improving page performance with Chrome DevTools
Umar Hansa's DevTool lesson on how to improve page performance.
Watch it
Free Font: Homemade
Locomotype designed this joyful brush font.
Get it
Pretzel
A macOS app that shows and searches keyboard shortcuts based on your currently focused app. By Amie Chen.
Check it out
Page Size and SEO - Are they related?
Learn how page size directly affects search rankings in this article by MachMetrics.
Read it
Gradient shadow in pure CSS
A nice button with a gradient shadow look using pseudo elements.
Check it out
Lazy Loading JavaScript Modules With ConditionerJS
Rik Schennink explains how ConditionerJS can help make websites more flexible and user-oriented.
Read it
Beat Blender
With this tool you can blend beats using machine learning and create music in a fun new way.
Check it out
Skin and Eye Rendering
Insane Three.js model rendering by David Lenaerts.
Check it out
Leaf Notes – An Interactive Web Toy
Read about Matt Deslauriers' interactive web toy that he built for the design and animation studio, Tendril.
Check it out
Pure CSS Saturn Hula Hooping
Jamie Coulter made a hula hooping Saturn just with CSS.
Check it out
Lunacy (Beta)
Lunacy is now in beta: a native Windows app that works offline and supports .sketch files.
Check it out
A list of cool Chrome DevTools Tips and Tricks
Some Chrome DevTools tips by Flavio Copes.
Check it out
Medical Icon Set
A free icon set with some excellent medical themed icons.
Get it
WAI-ARIA: the dark art of accessibility?
In case you missed it: an awareness-raising blog post for web developers about ARIA.
Read it
Free Font: Altero
Stefano Giliberti designed this display typeface with a bold look.
Get it