Collective #711
Publikováno: 12.5.2022
Motion DevTools * Voby * State of CSS 2022 * Learn CSS Subgrid * Markdoc
The post Collective #711 appeared first on Codrops.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_wotw.jpg)
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.
![Collective 711 ImageKit](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_imagekit.jpg)
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.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_design.jpg)
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.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_oby.jpg)
Voby
A high-performance framework with fine-grained observable-based reactivity for building rich applications.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_subgrid.jpg)
Learn CSS Subgrid
A deep-dive into the new CSS subgrid feature with real-life examples and use-cases. By Ahmad Shadeed.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_stateofcss.jpg)
State of CSS 2022
Web styling features of today and tomorrow, as seen at Google IO 2022, plus some extras. By Adam Argyle.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_music.jpg)
Lil Beat Maker
A free online beat-making machine based on a circular timeline.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_mother.jpg)
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.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_sql.jpg)
Announcing D1: our first SQL database
Learn about D1, Cloudflare’s first SQL database, designed for Cloudflare Workers.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_font.jpg)
Free Font: n27
Atipo released a super modern new font and offers the regular and italic weight for free.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_robotoflex.jpg)
Roboto… But Make It Flex
Google’s most popular font gets customizable with the launch of Roboto Flex.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_designsys.jpg)
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.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_newsletter.jpg)
vscode.email
A new weekly newsletter for front-end developers with a specific focus on tools. Curated by Louis Lazaris.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_cssbetter.jpg)
Writing Better CSS
Adam Laki from Spruce CSS offers some good advice on writing better CSS.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_markdoc.jpg)
Markdoc
Markdoc is a powerful, flexible, Markdown-based authoring framework by Stripe.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_zoran.jpg)
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.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_modules.jpg)
JavaScript Modules – Complete Guide to ES Modules and Module Bundlers
A massive guide with everything you need to know about ES Modules and Bundlers.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_scroll.jpg)
Longines Spirit Zulu Time
A beautiful scroll experience made by the folks of Immersive Garden.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_apis.jpg)
The Web Beyond Browsers
Some thoughts on the standardization of web platform APIs beyond the browser by Jim Nielsen.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_smoothscrolling.jpg)
Lenis: Smooth scroll
Studio Freight’s take on smooth scroll: lightweight, hard working and smooth as butter. Still in WIP but looking great already!
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_jelly.jpg)
Jelly
A real-time jelly simulation on the GPU made by saharan.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_iconex.jpg)
Iconex
Iconex is a gigantic set of more than 1000 icons for Figma. Made by Dmitry Mikhaylov.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_statefrontend.jpg)
The State of Frontend 2022
Results of surveys filled in by 3073 developers from 125 countries about the state of frontend.
![Collective 711 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/05/C711_stack.jpg)
Stack to Content Layout Transition
An experimental layout transition where a stack of images animates to a gallery view, showing some more content.
The post Collective #711 appeared first on Codrops.