Collective #677
Inspirational Website of the Week: Infrared
Soft animations and a perfect color scheme make this website's design glow. Our pick this week.
Get inspired
Master new skills
Do you love building things? Then this event is for you! Join the community for an enjoyable night of coding.
Find out more
Access modern GPU features with WebGPU
Learn about WebGPU and how it enables high-performance 3D graphics and data-parallel computation on the web.
Read it
A Deep Dive Into The Wonderful World Of SVG Displacement Filtering
In this article, Dirk Weber explains the SVG `feDisplacementMap` filter primitive with a good number of examples to demonstrate the concept of animated displacement maps.
Read it
Why are hyperlinks blue?
Take a deep dive into the history of interfaces and link designs over the years and learn about the origin of the blue link we know today.
Check it out
An Interactive Guide to CSS Keyframe Animations with @keyframes
In this tutorial you'll learn how CSS keyframes work from the ground up, and see how you can use them to build high-quality animations. By Josh W Comeau.
Read it
Crafting Organic Patterns With Voronoi Tessellations
Learn to create beautiful, versatile, and organic generative patterns inspired by the natural world. By George Francis.
Read it
The Beauty of Bézier Curves
A wonderful video on how Bézier curves work. By Freya Holmér.
Watch it
Buttons Generator
100+ buttons you can copy with just a click and paste into your project. By Marko Denic.
Check it out
Building A Stepper Component
Ahmad Shadeed shows how to build a horizontal and vertical stepper component with CSS flexbox.
Read it
Basement grotesque
Basement grotesque is the first font by basement.studio and they did a wonderful website to present it!
Check it out
couleur.io
A simple color tool to help you find good color palettes for your web projects. This tools spits out modern CSS you can use right away in your projects.
Check it out
Exploring the CSS Paint API: Blob Animation
Temani Afif shows how to pull off a blob animation using CSS with the CSS Paint API.
Read it
Vector? Raster? Why Not Both!
Zach Leatherman ran into an interesting problem and shared what he learned from it.
Read it
Using PDFs with the Jamstack - Building a Document Viewer
Using Adobe PDF Services to build a document viewer for your Jamstack site
Check it out
How to Use Promise.any()
Learn how to use the Promise.any() to get the first fulfilled promise from an array of promises.
Read it
Prettymaps
A small set of Python functions to draw pretty maps from OpenStreetMap data.
Check it out
A primer on the OpenAI API - Part 1
The first part in a series on learning how to use the OpenAI API. By Chris Price.
Read it
Infinity Zoom / Log Spherical Mapping
Super cool demo: taking 3D space and folding it into a sphere, using WebGL/Fragment Shader.
Check it out
Surface Sampling in Three.js
Learn how to use the MeshSurfaceSampler in Three.js to create some very interesting effects.
Read it