Inspirational Website of the Week: ChungiYoo
A bright mix of fine artistry and playfulness, the website of Chungi Yoo shines with lovely details. Yet another masterpiece by Zhenya Rynzhuk. Our pick this week.
Level Up Your Development with Insight. For Free.
Our analytics empower developers by letting your code speak for itself with metrics, badges, & dashboards for self-improvement & career growth.
Codrops Collective Searcher
David de los Santos Boix created this fantastic search app for our Codrops Collective. Thank you, David!
Blob Opera
A mind-blowing machine learning experiment by David Li where you can create your own opera inspired song.
Scrollytelling with React
Varun Vachhar explains how he built a React and Intersection Observer based solution for Scrollytelling.
Cross-browser paint worklets and Houdini.how
Learn how to implement cross-browser Houdini Paint API’s and explore a world of Houdini worklets with Houdini.how.
Welcome Yari: MDN Web Docs has a new platform
Read all about MDN Web Docs’ new platform (codenamed Yari) which finally launched.
Book of Flowers
Aristide Benoist and Zhenya Rynzhuk are cooking a superb interactive project. It’s public work in progress so that everybody can follow their journey.
Cameras and Lenses
Bartosz Ciechanowski explains how cameras and the lenses work and how adjusting a few tunable parameters can produce fairly different results.
Tiny-Swiper
A JavaScript carousel powered by plugins with a native-like experience. It has zero dependencies and is written in TypeScript.
Case Study: lynnandtonic.com 2020 refresh
A wonderful case study by Lynn Fisher with thoughts and a look at the prrocess for the lynnandtonic.com 2020 redesign.
Meow Mart
A super stylish game by Mailchimp.
366 Cans Challenge by Studio Blackthorns
A can a day in 2020. This beverage challenge is a celebration of Studio Blackthorns’ 10th year as a strategic creative consultancy.
What Makes CSS Hard To Master
CSS may appear easy at first, but it isn’t. Find out why in this article by Tim Severien.
EStimator.dev
Find out how much turning on modern JS could save with this handy calculator.
Introducing Cash By Cash App
A really cool 3D presentation of Cash App’s latest collection.
Implementing critical CSS, from CMS to CLS
Erwin Hofman shares his personal journey on critical CSS.
CSS Individual Transform Properties
Learn about the advantages of composing individual transform properties which will soon be supported in modern browsers.
Are your Anchor Links Accessible?
Amber Wilson demonstrates how to make sure that anchor links are accessible.
Deep dive into Rome: Linting, compiling, and bundling
A deep dive into the Rome toolchain, with some examples of how it performs against the most common tasks.
CSS paint API: Being predictably random
Jake Archibald shows how to do some random CSS using the CSS Paint API.
user-scalable=no and suppressing zoom suppression
Peter-Paul Koch on why suppressing user zoom is an awful idea and the current state of its “support”.
Sticky CSS Grid Items
Melanie Richards explains how to get position sticky working on a grid item without setting a hacky height.
Pantone Color of the Year 2021
Announcing the Pantone Color of the Year 2021 PANTONE 17-5104 Ultimate Gray + PANTONE 13-0647 Illuminating.
How to Create Animated Cards with WebGL and Three.js
Johnny Simpson explains how to pull off a cool card effect.
2020 Tools Survey Results
See the most popular tools used by over 4,000 designers based on this annual survey.
Handling Short And Long Content In CSS
An in-depth article on how to handle short and long content in CSS.
Centering in CSS
Follow 5 centering techniques as they go through a series of tests to see which one is the most resilient to change. By Adam Argyle.
Tilting Maze game
Hunor Marton Borbely made this cool little maze game.
Coding a 3D Lines Animation with Three.js
In this coding session you’ll learn how to use Three’s DepthTexture to create some animated 3D lines.
The post Collective #641 appeared first on Codrops.