Collective #693
Inspirational Website of the Week: Plus X Virtual Showroom
Sharp, bold and slick. This website sets their own unique style and provides a fresh and fast experience.
Get inspired
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
The story of the fight to archive the internet
Learn why the founder of the Internet Archive says his project is under threat.
Check it out
The CSS :has() selector is way more than a “Parent Selector”
Bramus on the new and powerful :has() selector.
Read it
Array Grouping in JavaScript
Learn about the new array.groupBy() and array.groupByToMap() methods that let you group an array by a certain criteria.
Read it
Chrome Users Beware: Manifest V3 is Deceitful and Threatening
Like FLoC and Privacy Sandbox before it, Google Chrome’s Manifest V3 is another example of the inherent conflict of interest that comes from Google controlling both the dominant web browser and one of the largest internet advertising networks.
Check it out
Fuite
Fuite is a tool for finding memory leaks in web apps. By Nolan Lawson.
Check it out
Defining the web3 stack
Nader Dabit identifies the building blocks of the web3 technology stack in an introductory guide.
Read it
Is It Time for the JavaScript Temporal API?
Craig Buckler’s introduction to the Temporal API, a proposal that is already in stage 3 of approval.
Read it
Globe Lib
Shu Ding’s thread where he explains how he made a tiny globe library called Cobe with WebGL and shaders.
Check it out
#Playground
A beautiful and playful 3D world made by Achmat Fauzi.
Check it out
WebGPU Sketch Dojo
A collection of experiments with the emerging WebGPU API. Created by Georgi Nikolov.
Check it out
Consistent, Fluidly Scaling Type and Spacing
Andy Bell on using a sizing scale and fluid type for making a website better.
Read it
How to Draw S-Curved Arrows Between Boxes / Rectangles
Alexander Wang shares how he went about drawing arrows between blocks for mind maps, flowcharts, etc.
Check it out
Smoothly Reverting CSS Animations
A great technique on how to revert a CSS transition when hover is over. By Nikola Đuza.
Check it out
React Native Skia (alpha)
React Native Skia brings the Skia Graphics Library to React Native.
Check it out
CSS in 2022
Bramus shares this great list of personal predictions for CSS in 2022.
Check it out
PrinceJS
An amazing “Prince of Persia” reimplementation written in HTML5/JavaScript. Check out the GitHub repo.
Check it out
Glitch Image Generator
Generate and save unique glitchy images. Made by Adam Fuhrer.
Check it out
Typejuice
Typejuice is a documentation generator for TypeScript Declaration Files inspired by godoc.
Check it out
Lynn Fisher
Lynn Fisher’s epic annual portfolio refresh! Try resizing your browser.
Check it out
Wrapping text inside an SVG using CSS
Jay Freestone explains how to use two SVGs and `shape-outside` to wrap text inside a shape.
Check it out
Mix
Mix is an expressive way to effortlessly build design systems in Flutter.
Check it out
Alternate Column Scroll Animation
A grid layout with columns that scroll in opposite directions and a content preview animation for the image.
Check it out
Three.js Animation with K-d (Christmas) Tree Algorithm
In this coding tutorial, you’ll learn how to recreate the animation seen on the website of ONE-OFF in Three.js using the K-d tree algorithm.
Check it out
Adding a Persistence Effect to Three.js Scenes
Learn how to enhance your Three.js scenes with postprocessing via framebuffers.
Check it out