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, PhD for bringing it to CSS. The CodePen link is coming soon.show more

Working on my CSS book landing page. What are... the most "wow" features that demonstrates contemporary CSS? 🤔show more

It took 40 minutes and 0 tears to create... this toggle 😛 Just CSS and HTML. Link to CodePen in comments 👇show more

💡 CSS Tip! Two circles, one arrow, and CSS... magic. 🪄 A cool demo packed with modern features (anchor positioning, attr(), container queries, shape(), and more!) 🤩 The shape and position of the arrow are fully controlled using CSS.show more

One of the most underrated CSS props is definitely... scroll snapping, it feels insane to me that these carousels are possible with CSS alone 🤯 This just went live on AtoBeach - meaning gesture support now works! 🥳show more

"CSS Holographic Masks" by Christian Alder

Tailwind CSS Tip ✨ You can create some cool... looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔show more

💡CSS Tip! Create a tooltip that follows an anchor... with modern CSS! No JavaScript is used to control the position of the tooltip or its tail. It's 100% CSS magic!show more

Work in progress, but this is so fucking cool... I just have to share.. I'm moving the entire CSS pipeline off the main thread in Ladybird. This allows us to animate any CSS properties we want and they just keep going smoothly despite heavy JS execution! Video demo is animating a bunch of flex and grid layouts while JS churns on the main thread. Same demo in Chrome for comparison. Welcome to the future, bros 😎show more

An awesome CSS trick is to use :hover on... the container and :not(:hover) on the items that are not currently hovered to make more advanced effects 👇👨‍💻show more

In Firefox DevTools you can use a visual editor... to adjust CSS clip-path of an element! Love such small features, just like the visual controls for flexbox and grid in Chrome DevTools 🔥show more

HTML/CSS is Turing complete, so why not compile programs... to plain HTML/CSS and runs with zero bytes of JavaScript?show more

"Avatar Indicators, using CSS Mask / Trig" by Simon Goellner

CSS shape() is now Baseline Newly Available → The... shape() function allows you to create responsive, complex paths for layouts and animations using standard CSS units like %, rem, and calc().show more

The triangle🔺 is the most popular shape and I... still see old and obsolete methods to create it. ⚠️STOP DOING THIS⚠️ 👉 A collection of CSS-only triangles made with a single-element and modern CSS. With the border-only and rounded corners variations.show more

"CSS <color-input> Color Picker" by Adam Argyle

made only using css. no js listener used. took... me longer than i thought it would. for hover state im doing `:has(*:is(.sidebar-icon-trigger:hover` so much you can do in css using pseudo classes. invest in css.show more

Quick demo of this CSS-driven configuration coming in Tailwind... CSS v4 — creating a new `font-comic` utility by just creating a new CSS variable under our new `@​theme` directive. No JS configuration file, all the same theme customization flexibility 🤩show more

Are those … CSS Scroll-Driven Animations on in Safari?... Yes they are! What made this possible is a polyfill our team has been working on: Load up the polyfill JS file and … that’s it - there is no other step.show more