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 inspiredEver 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 freeMotion 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 outVoby
A high-performance framework with fine-grained observable-based reactivity for building rich applications.
Check it outLearn CSS Subgrid
A deep-dive into the new CSS subgrid feature with real-life examples and use-cases. By Ahmad Shadeed.
Check it outState of CSS 2022
Web styling features of today and tomorrow, as seen at Google IO 2022, plus some extras. By Adam Argyle.
Read itLil Beat Maker
A free online beat-making machine based on a circular timeline.
Check it outPOLA "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 outAnnouncing D1: our first SQL database
Learn about D1, Cloudflare’s first SQL database, designed for Cloudflare Workers.
Read itFree Font: n27
Atipo released a super modern new font and offers the regular and italic weight for free.
Check it outRoboto... But Make It Flex
Google’s most popular font gets customizable with the launch of Roboto Flex.
Read itBuilding 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 itvscode.email
A new weekly newsletter for front-end developers with a specific focus on tools. Curated by Louis Lazaris.
Check it outWriting Better CSS
Adam Laki from Spruce CSS offers some good advice on writing better CSS.
Read itMarkdoc
Markdoc is a powerful, flexible, Markdown-based authoring framework by Stripe.
Check it outPractical 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 itJavaScript 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 outLongines Spirit Zulu Time
A beautiful scroll experience made by the folks of Immersive Garden.
Check it outThe Web Beyond Browsers
Some thoughts on the standardization of web platform APIs beyond the browser by Jim Nielsen.
Read itLenis: 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 outJelly
A real-time jelly simulation on the GPU made by saharan.
Check it outIconex
Iconex is a gigantic set of more than 1000 icons for Figma. Made by Dmitry Mikhaylov.
Check it outThe State of Frontend 2022
Results of surveys filled in by 3073 developers from 125 countries about the state of frontend.
Check it outStack 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