Collective #707

Inspirational Website of the Week: Six
A super slick design with sharp typography and great layouts. Our pick this week.
Check it out
Instant websites for your clients with Divi Layout Packs
With the Divi Layout Packs you'll get world-class designs ready to be used for your client projects.
Check it out
Three-gpu-pathtracer
An epic path tracing renderer and utilities for Three.js built on top of three-mesh-bvh. By Garrett Johnson.
Check it out
Picture perfect images with the modern <img> element
Addy Osmani writes about how important images are and how they can affect your web app's performance more than any other part of your code.
Read it
Building a dialog component
A foundational overview of how to build color-adaptive, responsive, and accessible mini and mega modals with the <dialog> element. By Adam Argyle.
Read it
Home sweet homepage
The fantastic journey of growing up online by Sailor Mercury.
Check it out
Ideal SVG exports
A random collection of opinions on how design tools should export SVGs.
Check it out
CSS :has() A Parent Selector Now
Matthias Ott explains how the :has() selector works and shows how it's not only useful as a parent selector.
Read it
Reasonable Colors
Reasonable Colors is an open-source color system for building accessible, nice-looking color palettes.
Check it out
JavaScript function composition: What’s the big deal?
An article by James Sinclair explains what the big deal with function composition is.
Read it
CSS Parent Selector
A deep-dive into the CSS :has parent selector with some use-cases and examples. By Ahmad Shadeed.
Read it
The struggle of using native emoji on the web
Nolan Lawson on the miserable state of Emoji support in browser.
Read it
Just a Calendar
Just a no nonsense calendar made by Shrikant Sharat Kandula.
Check it out
Chalk.ist
A tool to turn your source code into beautiful images.
Check it out
Lexical
Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.
Check it out
CryptoFont
Crisp webfont icons and SVG logos of many cryptocurrencies.
Check it out
The complete guide to protecting your APIs with OAuth2 (part 1)
A deep dive into the complex OAuth2, the most popular specifications for API authentication. By Dan Moore.
Read it
Eight Colors
Eight Colors is a block shifting game where the goal is to shift circular blocks to reach the target. Made by Shubham Jain.
Check it out
Dave Seidman
Dave Seidman's portfolio has a cool project slideshow with a 3D shape in a polygonal look that morphs into another one.
Check it out
How to Fix Your Low-Contrast Text
Learn how to solve 30% of the web's accessibility defects with just the help of a calculator. By Ben Myers.
Read it
Creating a Fluid Distortion Animation with Three.js
A coding session where you'll learn how to create the interactive liquid-like effect from the PixiJS website using Three.js.
Check it out
On-Scroll Text Repetition Animation
An on-scroll animation that shows repeated fragments of a big text as seen on the website of Dr. Dabber.
Check it out