Collective #711
Inspirational Website of the Week: Vendredi Society
This web gem offers a very smooth scroll experience, a delightful color theme and fine effects. Our pick this week.
Get inspired
Ever felt that videos are hurting your web performance?
Start delivering rich videos across devices with automatic optimizations, on-the-fly video transformations, and integrated video CDN.
Try it free
Motion DevTools
Motion DevTools is a Chrome extension for creating web animations where you can inspect, edit and export animations made with CSS and Motion One.
Check it out
Voby
A high-performance framework with fine-grained observable-based reactivity for building rich applications.
Check it out
Learn CSS Subgrid
A deep-dive into the new CSS subgrid feature with real-life examples and use-cases. By Ahmad Shadeed.
Check it out
State of CSS 2022
Web styling features of today and tomorrow, as seen at Google IO 2022, plus some extras. By Adam Argyle.
Read it
Lil Beat Maker
A free online beat-making machine based on a circular timeline.
Check it out
POLA “Thank you to all mothers”
Organically changing flowers to express the innumerable shapes and love of mothers. A beautiful ad project made by mount inc.
Check it out
Announcing D1: our first SQL database
Learn about D1, Cloudflare’s first SQL database, designed for Cloudflare Workers.
Read it
Free Font: n27
Atipo released a super modern new font and offers the regular and italic weight for free.
Check it out
Roboto… But Make It Flex
Google’s most popular font gets customizable with the launch of Roboto Flex.
Read it
Building a Design System from scratch
Maxime Heckel’s deep dive into his experience building his own design system that documents my process of defining tokens, creating efficient components, and shipping them as a package.
Read it
vscode.email
A new weekly newsletter for front-end developers with a specific focus on tools. Curated by Louis Lazaris.
Check it out
Writing Better CSS
Adam Laki from Spruce CSS offers some good advice on writing better CSS.
Read it
Markdoc
Markdoc is a powerful, flexible, Markdown-based authoring framework by Stripe.
Check it out
Practical Use Cases for :has() Pseudo-Class
Find out how the :has() parent selector can help you simplify your code and avoid JavaScript entirely using practical, real-life examples.
Watch it
JavaScript Modules – Complete Guide to ES Modules and Module Bundlers
A massive guide with everything you need to know about ES Modules and Bundlers.
Check it out
Longines Spirit Zulu Time
A beautiful scroll experience made by the folks of Immersive Garden.
Check it out
The Web Beyond Browsers
Some thoughts on the standardization of web platform APIs beyond the browser by Jim Nielsen.
Read it
Lenis: Smooth scroll
Studio Freight’s take on smooth scroll: lightweight, hard working and smooth as butter. Still in WIP but looking great already!
Check it out
Jelly
A real-time jelly simulation on the GPU made by saharan.
Check it out
Iconex
Iconex is a gigantic set of more than 1000 icons for Figma. Made by Dmitry Mikhaylov.
Check it out
The State of Frontend 2022
Results of surveys filled in by 3073 developers from 125 countries about the state of frontend.
Check it out
Stack to Content Layout Transition
An experimental layout transition where a stack of images animates to a gallery view, showing some more content.
Check it out