Collective #652
![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_WOTW.jpg?x86293)
Inspirational Website of the Week: Tangan
An elegant, monochrome masterpiece that shines with thoughtful details and creative layouts.
Get inspired![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_betheme.jpg?x86293)
Be: A massive library of 600+ pre-built websites
$59 only. Use it for ANY type of project.
Discover more![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_chris.jpg?x86293)
Beyond Console.log() – Level up Your Debugging Skills
Christian Heilmann shows some advanced ways to use developer tools.
Read it![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_amigos.jpg?x86293)
Amigos Illustrations by Gustavo Pedrosa
A wonderful set of hand-drawn illustrations that you can try for free on Blush.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_conic.jpg?x86293)
Conic.css
Fantastic conic gradients. Get it by clicking on a gradient and then pasting it into your CSS.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_marble.jpg?x86293)
Biglia
A beautiful marble made in Three.js by Fabio Ottaviani.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_sysfonts.jpg?x86293)
System fonts don't have to be ugly
Make your site faster and more environmentally-friendly by taking a system-fonts-first approach. By Iain Bean.
Read it![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_logiccss.jpg?x86293)
Digging Into CSS Logical Properties
Learn how to use CSS logical properties to build multi-directional web layouts.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_frontend.jpg?x86293)
Front-end Tips
Super tiny, quick tips, tricks and best practices of front-end development.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_chess.jpg?x86293)
The Kilobyte's Gambit
Can you beat 1024 bytes of JavaScript in this chess game?
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_property.jpg?x86293)
Exploring @property and its Animating Powers
Learn how you can use @property to unlock things in CSS we've never been able to do before.
Read it![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_privacyembeds.jpg?x86293)
Privacy-friendly video embeds
Thomas Vantuycom explains how to be mindful of your users' privacy when embedding content from Vimeo and YouTube.
Read it![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_solaar.jpg?x86293)
Neptune Terminus
An interstellar journey to discover the tracks of Youssoupha's new album. Made by Jean-Baptiste Giffard.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_threematcap.jpg?x86293)
Madcaps
A wonderful demo by Ion Drimba Filho.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_stratum.jpg?x86293)
Stratum: UI kit for Figma
Stratum is a free UI sample kit for Figma designed by Denis Danilov, providing 9 ready-made web screens.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_gridcheatsheet.jpg?x86293)
CSS Grid Cheat Sheet Illustrated in 2021
Joy Shaheb's visual CSS Grid cheat sheet.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_redbean.jpg?x86293)
Redbean
A single-file distributable web server.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_text.jpg?x86293)
Variable Fonts on Three.js
A demo where you can change variable font weight with CSS on canvas2d, rendered like texture in Three.js. By Juan Fuentes.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_tiltshift2.jpg?x86293)
Interactive Tilt Shift effect
Amazing TroisJS examples by Kevin Levron.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_svg.jpg?x86293)
A Simple SVG Blob Editor [GSAP]
A simple spline editor where you can create SVG blobs. By George Francis.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_flowchart.jpg?x86293)
flowchart.fun
An open-source tool for generating flowcharts from text.
Check it out![Collective item image](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2021/03/C652_clippathslideshow.jpg?x86293)
Shape Slideshow with Clip-path
An experimental slideshow using clip-path to create shape transitions between slides.
Check it out