Inspirational Website of the Week: Anagram Club
Thoughtful design with sharp type and great, creative details. Our pick this week.
Instant websites for your clients with Divi Layout Packs
With the Divi Layout Packs you’ll get world-class designs ready to be used for your client projects.
pmndrs market
A new place for downloading web-ready 3D assets. Download CC0 models, textures and HDRI’s that you can use right away. Read more about it here.
Frustrating Design Patterns: Mega-Dropdown Hover Menus
Vitaly Friedman writes about what to keep in mind when designing and building a mega-dropdown and then explores alternatives and shares details for designing a better UX.
@keyframers: Scrolly Path with Cassie Evans
Cassie Evans joins David Khourshid and Stephen Shaw to build a beautiful scroll animation using SVG paths and GSAP.
Learn CSS
An evergreen CSS course and reference to level up your web styling expertise.
Container Queries in Web Components
Max Böck played with Container Queries and shares a great demo.
Iconoir
Iconoir is an open source SVG icons library with more than 900 icons.
mmm.page
A great visual tool for making a collage-like, unique website.
Aspect-ratio
Peter-Paul Koch shares a fallback for using aspect-ratio right now and talks about some more technical details.
Frontend Development in 2021 (A Complete Guide)
Harry Wolff explains all the libraries and technologies you need to know about to become a frontend expert.
Modern Blog Layout with CSS Grid
A great demo showing a well designed blog layout with individual scroll panels made by Aysenur Turk.
Codewell
Improve your HTML and CSS skills by practicing on real world design templates.
aRty face
A fantastic project by Duc-Quang Nguyen that translates pixels into data visualization.
5 steps to faster web fonts
Learn how to fine-tune your font files and optimize your loading strategy for maximum speed and minimum FOUT.
Modern Javascript: Everything you missed over the last 10 years
Sandro Turriate shares wrote a cheatsheet to get you caught up on all the JavaScript goodness that’s widely supported in modern browsers.
Advanced CSS Animation Using cubic-bezier()
Temani Afif shares some tricks that might help make things easier when dealing with complex CSS animations.
A(x56) – URL Lengthener
Jazz up your short and readable URLs to make them look, well, long and unreadable! A fun project by Piero Maddaleni.
The new responsive: Web design in a component-driven world
Una Kravets article on controlling macro and micro layout in a new era of responsive web design.
Newton’s CSS cradle
A wonderful CSS only demo by Amit Sheen.
Sequencer64
An intuitive 64-step drum sequencer progressive web app built using React, Redux, and Tone.js.
Euismod
Learn about CSS grid in a quick, easy, and interactive way.
How to easily add CSS animations to your projects
Chris Ferdinandi shows how to use Animista by Ana Travis to add CSS animations easily to any project.
Curly Tubes from the Lusion Website with Three.js
Learn how to replicate the curly tubes from the Lusion website using light scattering in Three.js.
UI Interactions & Animations Roundup #16
Get inspired with this special pick of the best UI animation and interaction shots from the past couple of weeks.
The post Collective #662 appeared first on Codrops.