We can get the number of siblings using sibling-count() but we cannot get the number of children yet. There is a proposal for a children-count() function, but until we get an official release, we can hack it using Scroll-Driven Animations…
Share on Bluesky: Implementing children-count() using Modern CSS (opens in a new tab)Share on LinkedIn: Implementing children-count() using Modern CSS (opens in a new tab)
Creating CSS Shapes is cool, but what about Random CSS Shapes? Thanks to the new random() function, we can generate unique shapes. A new shape appears on each page load. You never see the same shape twice. First off, blob shapes with a cool…
Share on Bluesky: Random Blob Shapes (opens in a new tab)Share on LinkedIn: Random Blob Shapes (opens in a new tab)
You can combine border-shape and border-area to easily border-only shapes with gradient coloration easily. No more hacks or complex code, just 3 lines and you're done! See the Pen Complex border-only gradient shapes by Temani Afif ( @t_afif…
Share on Bluesky: Complex border-only Shapes with Gradient Coloration (opens in a new tab)Share on LinkedIn: Complex border-only Shapes with Gradient Coloration (opens in a new tab)