Collective #669

Inspirational Website of the Week: Benjamin Righetti
An amazing design with thoughtful details and joyful scroll experience! Our pick this week.
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

Access Guide
Access Guide is a friendly introduction to digital accessibility based on WCAG 2.1.
Check it out

Typedream
The simplest way to build a website with no-code, as easy as writing on Notion.
Check it out

Building a Responsive Layout with CSS Grid and Container Queries
Stephanie Eckles teaches us how to make a Food Menu with CSS Grid, container queries, CSS functions, aspect-ratio, and more.
Watch it

Style Template
Style is a free and elegant Bootstrap 4 template made by the folks of Untree.
Check it out

How to Use Promise.all()
Learn how to use Promise.all() to perform parallel async operations in this article by Dmitri Pavlutin.
Read it

npm audit: Broken by Design
Dan Abramov shares his thoughts on why the way npm audit works is broken and why it needs to be fixed now.
Read it

Theme Color in CSS
A very interesting article by Jim Nielsen on how great it would be to use CSS for styling theme colors, instead of HTML.
Read it

Demystifying the material design expand and cross-fade effect
Mikael Ainalem explores the expansion effect of Material Design and shows how to use it.
Read it

Windy
A React UI kit powered by Tailwind that is easy to use.
Check it out

Using HSL Colors In CSS
In this article, Ahmad Shadeed explains what HSL is, how to use it, and shares some of the useful use-cases and examples that you can use right away in your current projects.
Read it

tsParticles
In case you didn’t know about it: A lightweight TypeScript library for creating particles. Check out the demo/generator.
Check it out

RTL:WTF
A one-stop-shop for explanation about Right to Left languages online.
Check it out

The Large, Small, and Dynamic Viewports
Read all about the new changes being proposed regarding viewport units in this article by Bramus.
Check it out

CSS feature detection in JavaScript?!
Arek Nawo is exploring ways of CSS feature detection in both CSS and JavaScript.
Read it

Meet :has, A Native CSS Parent Selector (And More)
In this article, you’ll learn about the early spec of the :has selector, and see how it should improve the CSS workflow once it’s released. By Adrian Bece.
Read it

3D Bay
An extensive collection of free 3D stock images brought to you by CloudDevs.
Check it out

Subscapes (Part 3 – Code)
Part 3 of Matt DesLauriers’ Subscapes blog post series where he explains how to create fantastic generative art.
Read it

Build a Tetris game with HTML Canvas, CSS, and JavaScript on Autocode
Janeth Ledezma Graziani first article in a series on how to code a Tetris game.
Read it

Vechai UI
A collection of accessible React UI components with a built-in dark theme using Tailwind CSS.
Check it out