You can finally position tooltips, dropdowns, and menus relative to another element... in pure CSS. ☝️
It became newly available in January 2026 when Firefox 147 completed the set.
It’s still relatively fresh, and some advanced features (like certain `position-try` behaviors) still have gaps, so use progressive enhancement if you need to support older browsers.
Oh man, I'm so happy about this 🤟
Meet `contrast-color()`: You give it any color; it returns either `black` or `white`, whichever provides better contrast.
Shipped in Chrome 147, Safari 26, Firefox 146, and Edge 147 (April 2026).
Pure CSS that guarantees readable text.
PS. If you want occasional frontend tips in your inbox, you can join here: https://bits.iprodan.dev
I created a small interactive demo showcasing `contrast-color()`.
Go check it out https://iprodan.dev/l/contrast-color/
You can now style an entire component based on a CSS variable set on any parent. No prop drilling, extra classes, or JavaScript, just pure CSS reacting to context.
Now live in Chrome, Safari, Firefox, and Edge in the latest releases.
CSS just killed another JavaScript library.
CSS Grid Lanes (aka Masonry) is here! Safari (26.4+) got it first — everyone else is still catching up.
That’s all it takes. ▲
No more Masonry.js, fragile Flexbox hacks, or calculating positions in JavaScript — just pure CSS that natively creates the classic Pinterest/waterfall layout.
Chrome/Edge/Firefox - behind the flag.