This issue of What’s !important brings you clip-path jigsaws, a view transitions toolkit, name-only containers, the usual roundup of new, notable web platform features, and more.
Creating a jigsaw puzzle using clip-path
Amit Sheen demonstrated how to create a full jigsaw puzzle using clip-path. While I doubt that you’ll need to create a jigsaw puzzle anytime soon, Amit’s walkthrough offers a fantastic way to acquaint yourself with this evolving CSS property that’s becoming more and more popular every day.
For example, Chrome Canary shipped rounded clip-path polygons only last week:
I and Jason are currently working on implementing the CSS `polygon() round` keyword in Chrome.
This is one of my favorite CSS features! Thanks to @lea.verou.me for bringing it to CSS.
Enable the `enable-experimental-web-platform-features` flag in Chrome Canary
codepen.io/yisi/pen/NPR…— yisibl.bsky.social (@yisibl.bsky.social) Apr 9, 2026 at 7:25
And there’s also talk of implementing other corner-shape keywords such as bevel, too.
Finally, since we’re on the topic, and because I somehow completely missed it for What’s !important #8, here’s Karl Koch demonstrating some really neat clip-path animations.
Get clippin’!
View transitions toolkit
The Chrome DevRel team created a view transitions toolkit, a collection of utilities that make working with view transitions a bit easier.
Here’s my favorite demo from the site:
Chrome shipped element-scoped view transitions only last month, so there’s no better time to dive into this toolkit.
How name-only containers can be used for scoping
Chris Coyier discussed the use of name-only containers for scoping, and how they compare to class names and @scope. Personally, I prefer @scope because it tends to result in cleaner HTML, and it seems that Chris has updated his stance to be more @scope-aligned too, but it really comes down to personal preference. What’s your take on it?
Hey, remember subgrid?
At one point, subgrid was one of the most highly-anticipated CSS features, but it’s been two and half years since it became Baseline Newly Available, and it’s barely made a dent in the CSS landscape. This is a shame, because subgrid can help us to break out of grids properly and avoid the ‘ol Michael Scofield/nested wrappers/negative margins extravaganza.
But don’t worry, David Bushell’s very simple explanation of subgrid has you covered.
You Might Not Need…JavaScript?
Remember You Might Not Need jQuery? Pavel Laptev’s The Great CSS Expansion has a similar vibe, noting CSS alternatives to JavaScript libraries (and JavaScript in general) that are smaller and more performant.
Missed hits
- Chrome 147
contrast-color()(now baseline)border-shape(no Safari or Firefox support)- CSSPseudoElement JavaScript interface (no Safari or Firefox support)
scrollrange for view timelines (no Safari or Firefox support)- Element-scoped view transitions, as mentioned earlier (no Safari or Firefox support)
- Safari TP 240
revert-rulekeyword (already supported by Chrome and Firefox)
- Safari TP 241
overflow-anchor(already supported by Chrome and Firefox)stretch(already supported by Chrome)
It’s becoming increasingly difficult to keep up with all of these new CSS features. I attempted way too many rounds of Keith Cirkel’s new CSS or BS? quiz, and my best score was only 18/20. Sad times. Let me know your score in the comments (unless it’s higher than mine…).
What’s !important #9: clip-path Jigsaws, View Transitions Toolkit, Name-only Containers, and More originally handwritten and published with love on CSS-Tricks. You should really get the newsletter as well.
