Clément Ducerf

Lead front-end dev. - Design & development stuff • Design Systems • Typography • Creative coding • Freelancing

[Una 🇺🇦 @Una]

OoooOOooh! Guess what! As of Chrome 149, shape() works in shape-outside!

So you can really *shape* your UI's 😉*

rect() and xywh() are also supported for shape-outside in Chrome 149

*(just let me have my Mom joke)

[Steve Ruiz @steveruizok]

I was curious about how design apps differ in their edge / corner / rotate hit areas, so I wrote a script to move my mouse in a 50x50 grid and track what the cursor was.

[Tech with Mak @techNmak]

Found a UI library that made me mass mass mass mass mass angry.

Angry that this isn't how everything works.

Oat:
→ 6KB CSS + 2.2KB JS
→ Zero dependencies
→ No framework required
→ No build step
→ Semantic HTML only

You write <button>. It looks good.
You write <dialog>. It looks good.
You write <input>. It looks good.

No className="px-4 py-2 rounded-md bg-blue-500"

No <Button variant="primary" size="md">

Just HTML.

Accessible. Keyboard navigable. Dark mode included.

Built by Kailash Nadh (CTO @ Zerodha)

[Una 🇺🇦 @Una]

Web platform news 🗞️

Landing in Chrome 148: sticky positioning now works on a per-axis basis

This means you can have sticky elements that track different scroll containers on different axes.

(📽️ from @bramus's article, 🔗⬇️)

[Adam Pietrasiak @pie6k]

Fascinating.

iOS: "I will not allow .vibrate in the browser."

Also iOS: The toggle <input /> can have the "switch" attribute, which makes the phone vibrate when you toggle it -> people build the entire haptic library on top of this fact.

Also, creating a dope video of your library will greatly help it become popular.

[Soren @sorenblank]

`tabular-nums` should be the default for any number that updates ( timers, counters, prices, percentages, scores, live data etc ).

you can enable this tnum OpenType feature using the CSS property `font-variant-numeric`.

.tabular-nums {
font-variant-numeric: tabular-nums;
}

[Chrome for Developers @ChromiumDev]

Geolocation access made simple. 📍

The &lt;geolocation&gt; element replaces complex scripts with a clear, user-initiated “Use (precise) location” button. Help users share their location with intent and recover from accidental blocks.

Upgrade your UI →https://t.co/5AyW10pnXS

[Codrops @codrops]

In today's in-depth tutorial, @davidaswell shows how to build a smooth horizontal parallax gallery from a clean DOM/CSS/JS setup to a GPU-powered WebGL (Three.js) version with shaders for that extra-fluid feel!

Follow along: https://t.co/AL9RAGgS4Y

[WebGL / WebGPU @webgl_webgpu]

🧉 Editor Showcase: A Shopify store seamlessly mixing Three.js, Lottie, and HTML.

MANA Yerba Mate renders each flavor as its own animated 3D world, layering a Three.js canvas with GSAP scroll orchestration and Lottie sequences on top of a @Shopify storefront. There's a platformer game hidden in the footer.

🔗 https://t.co/7FWeXgJ1eI

CC: @grc_michael, @lpaquet83, @workbypam

#WebGL #ThreeJS #CreativeDev #GSAP #Shopify

[charlota @0xCharlota]

https://t.co/uI1K3ojTHZ

[Firefox for Web Developers @FirefoxWebDevs]

If you had to pick _one_, which web platform feature would you like in Firefox that isn't part of the Interop 2026 effort? https://t.co/cAOY07bfL5

[Firefox for Web Developers @FirefoxWebDevs]

It's time for Interop 2026! This is a cross-browser effort where we agree on a set of focus areas to improve compatibility.

Here's how things went in 2025, and what we're taking on for 2026: https://t.co/XKhe7Aq1BD

[Ben Houston @benhouston3d]

HDRify, the JavaScript library for reading/writing EXR, HDR, and UltraHDR, gets a website:

https://t.co/6o516aKWnI

Load, convert, and preview your high dynamic range images in the browser in real-time.

[Haz @diegohaz]

This border-radius transition 🤌🏽
Believe it or not, it's just CSS.

[Gilles Babinet @babgi]

Il faut lire ce long texte de Dario Amodei -CEO de Anthropic- pour comprendre comment il conçoit la stratégie de son entreprise, ce qui l'inquiète et le motive, mais aussi les idées et passions qui traversent la silicon Valle. Passions expliquant largement l'immense excitation existant autour de l'intelligence artificielle.
Il faut le dire tout net : Amodei n'est pas optimiste, il pense que les risques liés à l'avènement de l'AI sont immenses, tout aussi bien sur le plan militaire qu'en ce qui concerne les risques d'autonomie des machines, mais aussi ceux attenant à la disparition de nombreux emplois sans même parler dez risques d'abrutissement généralisé de la société.
J'ai de nombreux points de désaccords avec les idées ici exprimées mais n'en reconnais pas moins une réflexion intéressante et même courageuse dans le contexte politique des États-Unis.
https://t.co/wAMqOJHyBj

[Michael Feldstein @msfeldstein]

My favorite way of using cursor is asking it to deconstruct things i want to understand, show it to me step by step rather than one shot generations of things i dont understand. You can build your own interactive explainers.

[Joshua Guo @jshguo]

Great

[Simon @iced_coffee_dev]

Lerp is used everywhere in games. It’s simple, but combined with a few small tricks it becomes incredibly powerful.

This thread is full of visual examples.

[WebGL / WebGPU @webgl_webgpu]

🟢 News: GPU compute in the browser is finally real.

WebGPU now ships by default in Chrome, Firefox, Safari, and Edge—not a polyfill, not behind a flag. You can run LLMs client-side. Transformers.js and ONNX Runtime already ship WebGPU backends.

Eight years of spec work. No more asterisks.

🔗 https://t.co/bJlFm2wSCb

#WebGPU #GPU #Chrome #Safari #Firefox #Edge

[Jim Raptis @d__raptis]

I found the award for the "Most Unique Scroll Effect" website.

If you look closely as you scroll you see the previous content reversed in the background, like there is a roller on the top header.

That's what attention to detail looks like, in case you were wondering.

→ https://t.co/z7I9uimTal by @demiladeHQ