The Latest in CSS and Web UI: I/O 2024 Recap
Una Kravets dives into the current state of CSS, exploring some of the most game-changing new features redefining how we build web applications, featured live at Google I/O 2024.
Issue #588
On Compliance vs Readability: Generating Text Colors With CSS
Lea Verou explores if you can emulate the upcoming CSS contrast-color() function via existing CSS features and outlines the tradeoffs involved.
From Our Sponsor
Setapp — Dozens of Apps for Developers & Designers
Setapp is a hand-picked collection of quality software, packed with prime apps.
You’ll find many helpful design/development apps, like PixelSnap, Sip, TablePlus, and Gitfox, that will help you with your day-to-day frontend work.
CSS Weekly on YouTube
▶ Transition to "height: auto;" & "display: none;" Using Pure CSS
Find out how to easily transition from “height: 0;” to “height: auto;” and “display: none;” to “display: block;” without any hacks, tricks, or JavaScript, using only new CSS features: calc-size() function, transition-behavior property, and @starting-style at-rule.
▶ Animate HTML Details & Summary Elements Using Pure CSS
Find out how to fully animate the HTML Details/Summary disclosure widget using only CSS, including the Summary marker arrow rotate and height transition to open/close the element content.
Promoted Link
Meco – Enjoy Newsletters in a Space Designed for Reading
Meco is a distraction-free space for reading and discovering newsletters, separate from the inbox. Add your newsletters (including CSS Weekly) in seconds and liberate your inbox today!
Inspiration
Scroll King (PURE CSS)
Ben Evans created another stunning, interactive 3d demo that you should definitively check out.