Collective #610
Inspirational Website of the Week: Superfluid
Superfluid's web store design is an exciting clash of colors and motion. Our pick this week.
Get inspired
15 Tools and Services Worth Checking Out
Looking for web design tools or services? Here's a curated list for you.
Discover them now
Tutorialist
A great place to find the best software development tutorials from YouTube. By Dmytro Barylo.
Check it out
React Icon System
A tutorial on how to set up an icon system using SVGR, a tool for transforming SVGs into React components. By Varun Vachhar.
Read it
Deep JavaScript: Theory and techniques
A book that teaches practical JavaScript techniques by Dr. Axel Rauschmayer.
Check it out
CSS Custom Properties Fail Without Fallback
Some important notes on how CSS variables don't support the cascade when a value is invalid.
Read it
Artvee
A great site to browse and download high-resolution, public domain artworks.
Check it out
Inclusively Hiding & Styling Checkboxes and Radio Buttons
Sara Soueidan shows how to hide an element visually while keeping it screen-reader accessible.
Read it
Checkboxes waves
A super-crazy smooth checkboxes animation made by Louis Hoebregts.
Check it out
Learn Z-Index Using a Visualization Tool
Learn Z-Index and Stacking Context in a fun and interactive way.
Check it out
Airplanes
A wonderful GSAP ScrollTrigger demo by Steve Gardner.
Check it out
Snowpack + Eleventy + Sass + PostCSS
Zell Liew shares how he combined some great tools together to create websites.
Check it out
CasioPT-1.css
Sarah Fossheim's incredible CSS-only Casio synthesizer.
Check it out
border-radius playground
A great tool by Jhey Tompkins that lets you visualize border radii.
Check it out
How to delete all node_modules directories from your computer
Chris Fernandi distills a practical technique of freeing up space on your machine by deleting all node_modules folders.
Check it out
How to Compare Objects in JavaScript
Learn how to compare objects in JavaScript with referential, manual, shallow and deep equality.
Read it
ScrollTrigger - Highlight Text
Ryan Mulligan shows how to use the new GSAP ScrollTrigger plugin to animate highlighted text.
Check it out
Pure CSS halftone portrait from .jpg source
A great demo by Ana Tudor which shows a pure CSS halftone effect. View with a blend modes capable browser.
Check it out
Touch One
One of the many wonderful experiments by Jaume Sanchez Elias. Discover more in this thread.
Check it out
Genetic Drawing
Anastasia Opara open sourced her genetic drawing project that imitates a drawing process given a target image.
Check it out
Online text to diagram tools
A comprehensive list of text to diagram tools.
Check it out
Making Stagger Reveal Animations for Text
A short tutorial on how to recreate a letter stagger animation with GSAP and Splitting.js.
Check it out