Collective #605
![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_wotw.jpg?x86293)
Inspirational Website of the Week: Stephanie Jeong
Stephanie Jeong's portfolio combines fun interactions with surprise elements and a fantastic design.
Get inspired![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/Screen-Shot-2020-05-14-at-14.44.36.jpg?x86293)
Start your own business and become financially independent
Learn how to develop websites with the most popular WordPress theme in the world and secure your success as a freelancer.
Get Divi![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_visualizerobs.jpg?x86293)
IntersectionObserver Visualizer
A simple visualizer tool to assist with using the Intersection Observer API. By Michelle Barker.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_tania.jpg?x86293)
Understanding Destructuring, Rest Parameters, and Spread Syntax
Learn about destructuring, rest parameters, and spread syntax in this article by Tania Rascia.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_typography.jpg?x86293)
Micro-Typography: How To Space And Kern Punctuation Marks And Other Symbols
Thomas Bohm writes about the modern challenges of adding spacing to punctuation marks and other symbols.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_oscars.jpg?x86293)
The Oscars 2020
A Three.js experiment with the 2020's Oscars. Check out the this tweakable version here. By Robert Borghesi.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_svgpath.jpg?x86293)
SVG Path Visualizer
A visualizer where you can enter SVG path data and discover how it's build up.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_detectmotion.jpg?x86293)
Pose Animator
Pose Animator takes a 2D vector illustration and animates its containing curves in real-time based on the recognition result from PoseNet and FaceMesh.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_oldcss.jpg?x86293)
Modern CSS Solutions
A great series by Stephanie Eckles that examines modern solutions to old CSS problems.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_table.jpg?x86293)
A case study of complex table design
James Long shares how he approaches product design and all the considerations one needs to think about.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_blush.jpg?x86293)
Blush
Blush makes it easy to add illustrations to your projects. Create, mix, and customize illustrations made by artists around the world.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/Screen-Shot-2020-05-14-at-14.51.48.jpg?x86293)
Progressively enhancing radio buttons with SVG whilst staying accessible
Christian Heilmann shows how to progressively enhance a radio button group to look great and still work with keyboard and screen readers.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_cssonlyconsole.jpg?x86293)
switch.css
Sarah Fossheim's latest CSS creation.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_reef.jpg?x86293)
Reef
A lightweight library for creating reactive, state-based components and UI. Reef is a simpler alternative to React, Vue, and other large frameworks.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_cls.jpg?x86293)
Optimize Cumulative Layout Shift
In this guide, Addy Osmani covers optimizing common causes of Cumulative Layout Shift (CLS) such as images and iframes without dimensions or dynamic content.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_ahmad.jpg?x86293)
Everything I Learned About min(), max(), clamp() In CSS
Ahmad Shadeed shares what he learned about CSS Comparison Functions that are now supported in all major browsers.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_deno.jpg?x86293)
The Deno Handbook: a concise introduction to Deno
Learn how to get up and running quickly with Deno, a modern Node.js alternative.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_patterns.jpg?x86293)
Modernist Abstract Vector and Pattern Set
A very nice set of geometric vector illustrations.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_react.jpg?x86293)
Second-guessing the modern web
Tom MacWright explains why for things like blogs, shopping-cart-websites, mostly-CRUD-and-forms-websites, using React might not have any concrete benefit.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_cssscene.jpg?x86293)
Animal Crossing: Isabelle's Day Off
Tee Diang's beautiful CSS only scene.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_minigames.jpg?x86293)
Minigames & Playful Interactions
A great collection of microinteractions and mini-games.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_behind.jpg?x86293)
Behind the Source
Behind the Source is a series of interviews with the people behind the websites.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_linkanim.jpg?x86293)
Underline animation
An delightful animation where a line becomes a caret.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_layout.jpg?x86293)
Exciting Things on the Horizon For CSS Layout
Michelle Barker shares the exciting new things coming for CSS layout.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_height.jpg?x86293)
CSS fix for 100vh in mobile WebKit
Matt Smith shows how to use -webkit-fill-available as a CSS trick to handle the annoying mobile viewport bug with 100vh in WebKit on Safari.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_cheatsheet.jpg?x86293)
window.location Cheatsheet
The very useful window.location cheatsheet by Samantha Ming.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/05/C605_health.jpg?x86293)
Web Vitals
Web Vitals is an initiative by Google to provide unified guidance for quality signals that are essential to delivering a great user experience on the web.
Check it out