Collective #499

Inspirational Website of the Week: greeeg
A seamless web experience with great animations and shapes. Our pick this week.
Get inspired
30 years on, what's next #ForTheWeb?
Sir Tim Berners-Lee reflects on how the web has changed our world and what we must do to build a better web that serves all of humanity.
Read it
Meet The #1 WordPress Popup Plugin
Build Popups in the same place you build your website, so your site design remains consistent and you are able to get more conversions.
Check it out
Designing An Aspect Ratio Unit For CSS
Rachel Andrew writes about the exciting new aspect ratio unit for CSS, how it was designed and how it will work.
Read it
How to design an accessible color scheme
An article by Katie Riley on building a more accessible color scheme for Envoy.
Read it
ColouriseSG
An amazing tool that lets you colorize black and white images with deep learning.
Check it out
The Value of Inconvenient Design
An article by Jesse Weaver where he investigates at what cost technology makes seemingly inconvenient tasks easier.
Read it
Radicle
A peer-to-peer stack for code collaboration. Currently in alpha.
Check it out
KV Storage: the Web's First Built-in Module
Philip Walton explains what built-in modules are and introduces the asynchronous key/value storage module called KV Storage.
Read it
Accessibility Insights
A powerful accessibility tool for creating simple tests or in-depth audits of websites.
Check it out
Cube World
Tibix created this demo as part of the "Art of Noise" series, a collection dedicated to canvas animations using Perlin and Simplex noise.
Check it out
If statements and for loops in CSS
Peter-Paul Koch takes another look at CSS as a programming language and shows the analogues for if statements and for loops.
Read it
A JavaScript-Free Frontend
Matt Reyer shares how he uses as little JavaScript as possible when rebuilding his app Slimvoice.
Read it
Firefox Send
In case you didn't know about it: Firefox Send lets you share files with end-to-end encryption and a link that automatically expires.
Check it out
JavaScript "loose" comparison step by step
A tool that will help you understand how == works in JavaScript.
Check it out
A Complete Guide to useEffect
A very thorough guide to useEffect in React by Dan Abramov.
Check it out
Branded
A free tool to create and maintain style guides. By Muno Creative.
Check it out
Particles Field
A fantastic particles demo by Ricardo Mendieta.
Check it out
Stuff
A simple alternative to Facebook events. With distribution of invitations and collection of RSVPs.
Check it out
Questions in the Sky by Air France
A promo game implementation for Air France.
Check it out
How to manipulate CSS colors with JavaScript
Adam Giese takes a look at CSS color notations and shows how to manipulate the values with JavaScript.
Read it
Harry Potter Movies Quiz
In this project Dmytro Barylo is experimenting with localStorage, SVG animations and vue.observable.
Check it out
Image Distortion Effects with SVG Filters
Three distortion effects powered by SVG filters that are applied to an image when hovering a link.
Check it out