reminder: this magnetic nav link effect?
jus' a few lines of css + anchor positioning 🤙
li:has(a:is(:hover, :focus-visible)) { anchor-name: --a; }
ul::before {
position-anchor: --a;
left: anchor(left);
top: anchor(top);
width: anchor-size(width);
}
Instant page loads. No Next.js. No Nuxt. No framework at all. Just one JSON script tag.
The Speculation Rules API lets plain HTML pages prerender the next page before the user even clicks.
`image-set` should be the first choice when dealing with background images 🤌
One CSS line fixes:
→ 1x/2x and even 3x resolution switching
→ Modern format fallbacks - AVIF, JPEG, WebP
Zero JS. Pure CSS! 💪
✅Widely available since September 2023
⚡️ JavaScript: Promise.try()
Wraps any function, sync or async, so errors always end up in .catch() and never crash your code.
See it in action 👇
#JavaScript
I’ve migrated all my projects to `oklch()`. Since it's perceptually uniform, equal value changes look visually consistent, unlike other color models.
You don’t need to manually handpick colors to match. You can just change the values and the model keeps them uniform.
In graph theory, there are algorithms that find the shortest path between two nodes. I made one with pure CSS (including the graph drawing).
Drag the nodes, and the shortest path will update in real-time!
https://t.co/glUAF5PJti
A demo powered by all the modern CSS features🤩