Collective #414
Inspirational Website of the Week: #Art4GlobalGoals
A beautiful design with great typography and fantastic effects. Our pick this week.
Get inspired
Enroll in over 65,000 online courses for only $14.99 each
From web design and development to digital marketing to cooking courses, Udemy has something for everyone. Take top-rated courses, discover new passions, and expand your skills.
Pick your course
Guess.js
A very interesting toolkit for enabling data-driven user experiences on the web.
Check it out
First Input Delay
Philip Walton explains the "First Input Delay" interactivity metric that the Chrome team is currently experimenting with.
Read it
CSS Grid Layout Interface Builder
A very useful visual interface builder for CSS Grid that allows you to create and export your custom layouts (with legacy grid support).
Check it out
WebGL Distortion Slider
Ash Thornton implemented a beautiful Dribbble shot designed by Nathan Riley and applied a great three.js powered transition effect inspired by Robin's distortion idea.
Check it out
Free Font: MT Knox
A fine editorial display font designed by Morrison Type.
Get it
Themify
With Themify you can manage your application's themes in realtime, using a robust solution that's easily configurable. Read more about it in this article.
Check it out
The Front-End Tooling Survey 2018 - Results
The interesting results of this year's Front-End Tooling Survey by Ashley Nolan.
Check it out
Styling buttons, the right way
Florens Verschelde shows how to create basic styles for links and buttons, and how to make a custom .btn CSS component.
Read it
What's new in Chrome DevTools (Google I/O '18)
Learn about the latest features shipping in Chrome DevTools.
Watch it
My struggle to learn React
Brad Frost shares why he has trouble with learning React.
Read it
Overriding Default Button Styles
Chris Coyier explores how the default button styles can be overridden.
Read it
What's right with css-in-js
Micah Godbolt shares some interesting thoughts on CSS in JS as an answer to Brad Frost's "What's wrong with css-in-js".
Read it
World Draw
World Draw starts with a simple 2D sketch, which is then transformed into a customizable 3D model and placed into a virtual world.
Check it out
Fugue
High-quality music tracks for your projects. Free for a link, by the folks of Icons8.
Check it out
New CSS Features That Are Changing Web Design
A nice introduction to new CSS layout options with some interesting examples. By Zell Liew.
Read it
Using grids to create copies
Roman Komarov's interesting CSS grid demo where the items' sizes depend on a particular one.
Check it out
A Guide to JavaScript Regular Expressions
A great manual for regular expressions in JavaScript by Flavio Copes.
Read it
Summer Child Graphics Set
A beautiful summer themed illustration set by Helter Skelter.
Check it out
Workplace Brand Visualizations
A very interesting digital visualizations project that shows evolving animated graphic patterns.
Check it out
How To: Tune a Guitar
A beautiful and interactive guide that will teach you how to tune a guitar. By Matthew Conlen and Alex Kale from the Interactive Data Lab at the University of Washington.
Check it out
Emoji Bounce
A fun Emoji demo by Chris Gannon.
Check it out
Ranger
Ranger.js is a small, standalone library for working with ranges of numbers in JavaScript.
Check it out
Free Font: Mandorlato
An almond shaped font designed by Stefano Giliberti.
Get it