Collective #674

Inspirational Website of the Week: DILLINGER
A really cool design that uses some interesting typography effects. Our pick this week.
Get inspired

Be is Now The Fastest Way to Build a Website
“I have to say that the new live builder is an absolute masterpiece. So far I used elementor, but switching to your new builder will definitely affect the speed of my work and greater customer satisfaction. Love it!” – DinoMaron
Discover more

The State Of Mobile First and Desktop First
Is mobile first or desktop first still relevant today? An article that explores both with pros and cons for each. By Ahmad Shadeed.
Read it

HTTP/3 From A To Z: Core Concepts (Part 1)
After almost five years in development, the new HTTP/3 protocol is nearing its final form. Learn all about it in this series by Robin Marx.
Read it

CSS Transforms tutorial
In this blog post, Josh W Comeau takes a deep look at the “transform” property and shows some of the nifty things it can do.
Read it

Foundations
An important message from Jeremy Keith: “[The web] is for everyone. Not just for everyone to consume, but for everyone to make.”
Read it

Visualizing a codebase
How can we “fingerprint” a codebase to see its structure at a glance? Amelia Wattenberger explores ways to automatically visualize a GitHub repo.
Read it

Random links with Eleventy
Learn how to generate randomized links at built time with Eleventy. By Thomas Vantuycom.
Read it

Wicked Backgrounds
Create beautiful SVG background waves for your UI designs.
Check it out

JSKIDPIX
A JavaScript implementation of “Kid Pix”, an old Mac drawing application for children.
Check it out

Accessible contrast ratios and A-levels explained
All about those A’s — your guide to understanding and making use of the ratios that determine your accessible contrast.
Read it

Grids
A super-cool grid presentation by the folks of Obys Agency.
Check it out

Solar Storm
An audio reactive scene built with React Three Fiber by Varun Vachhar.
Check it out

Openby.design
Custom crafted free UI design resources, for personal and commercial projects.
Check it out

Practice / 3.js
A beautiful demo by Toshiya Marukubo.
Check it out

Exploring the CSS Paint API: Image Fragmentation Effect
Temani Afif shows how to create an interesting fragmentation effect using the CSS Paint API.
Read it

daisyUI
A Tailwind CSS components plugin with cool themes.
Check it out

Paper Trader Game
A simple game where you try to make as much money as you can in just 90 seconds.
Check it out

GitHub shortcut
New magic shortcut on GitHub: Press . on any GitHub repo and edit multiple files.
Check it out

Inspirational Websites Roundup #28
A hand-picked collection of the most beautiful and creative web designs from the past month.
Check it out

Superhero Animation Effect with SVG Filters
Learn how to create and animate a superhero-like illustration effect for the web using SVG filters and masks.
Check it out