Sugarcube is now publicly available!
sugarcube.sh
load-bearing @xkcd.com
Hey @adactio.com, I've been meaning to brush up on my DOM scripting skills and came across your book. But it's been a while since it was published. Do you think it still holds up or is there a different resource you point people to instead?
I always forget what properties are available now so I've written a quick post to put them all in one place
Underlining links with CSS
www.alwaystwisted.com/articles/und...
#FrontEnd #CSS #WebDev #WebDesign
that vinext project is interesting because if, as they claim, it was done by one engineer w/ AI in one week, that engineer is either claiming that they successfully code-reviewed about 22k lines of code every day, which no they didn't, or they are proudly inviting you to run unreviewed code
I keep forgetting how the CSS values `initial`, `unset`, `revert` and `revert-layer` roll back a declaration to a different point in the cascade. It was about time I jotted it down for my future self before it slips my mind again for the 1000th time.
arpit.blog/notes/2026/0...
Really looking forward to @bram.us' talk on CSS Anchor Positioning and @zachleat.com's talk on reducing the JS footprint.
I'll be attending @londonwebstandards.org's State of the Browser for the first time, remotely! ππ»
I do something similar in dev mode. I set π¨ emoji as my favicon so I can spot my tab instantly.
```html
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>π¨</text></svg>" />
```
I've been experimenting with an upcoming CSS feature called border-shape lately.
It's really cool what you can do with it: lots of practical applications + it opens a lot of doors for non-rectangular UIs!
Try it in Canary w/experimental web platform features on, & read more:
una.im/border-shape
> Some properties apply to the contents, and those are the properties that inherit. Other properties apply to the box, and do not inherit.
www.oddbird.net/2025/09/04/b...
itβs important to keep caring about how things work and how theyβre built
In the recording I first shuffle the items in each list using an Element-Scoped View Transitions on each list (running in parallel). Then I start an outer Scoped View Transition while the lists still are reshuffling.
Like I said: SO GOOD π€©
Try it yourself: codepen.io/bramus/pen/b...
Element-Scoped View Transitions are gonna be **SO GOOD**
Thereβs still some details to settle, but the main thing is there: run VTs on a subtree of the DOM, allowing parallel VTs.
And with `view-transition-scope` you can limit the scope of `view-transition-name` values, allowing VTs to be nested.
This could have been useful in the context of a search form. But `<input type="search">` already provides a native clear button for that single field.
arpit.blog/notes/2026/0...
Today I learned that setting `type="reset"` on a `<button>` element in HTML creates a reset button that, when activated, immediately clears all form data, resetting it to its initial state.
This is totally breaking my mind.
Congratulations on the 700 episodes @shoptalkshow.com @davatron5000.bsky.social @chriscoyier.net π
I've been a regular listener (watcher?) since you all started releasing on Youtube. Thanks for all the insight and laughs. It honestly feels like talking web dev with friends.
- Fellow Shop-o-maniac
The CSSWG just resolved to add this to the spec π₯³
github.com/w3c/csswg-dr...
@css-only.dev shared a CSS only way to compute the scrollbar width. From that number you can infer whether a gutter is present. But this too is a workaround.
css-tip.com/width-scroll...
Quick note, in case this just slipped through.
On Safari, the `.button--icon` doesnβt reveal the span text on hover since Safari doesnβt support `calc-size()` yet.
A simple `width: max-content` fallback, followed by `width: calc-size(max-content, size)` in an `@supports` rule, fixes the issue.
Love it.
I recently ran into a case where I wished I could use it with `@container` too. There is an open spec issue for `@custom-container`: github.com/w3c/csswg-dr...
Just spent some time playing with OKpalette, a color extraction tool by @meodai.bsky.social, and Iβm in awe.
The 3D spinning text pulled me in immediately. I assumed it was done using JS, finding out itβs done using CSS genuinely blew my mind.
Wrote more about it here: arpit.blog/notes/2026/0...
I built a color extraction tool because most of them kept giving me beige.
This is OKPalette. It adapts to the image before picking colors.
Also: first time I ever tried recording myself.
This is the least terrible attempt π
π
okpalette.color.pizza
youtu.be/qkZlgJLGKI4
Just added a new Cylinder vis to OKPalette. You can now toggle between the cube and the new cylinder view to explore your color palettes in 3D.
PS: I "forgot" to max out the manual number input. okpalette.color.pizza
www.youtube.com/watch?v=qkZl...
OKPalette is live! okpalette.color.pizza
I'm officially a curmudgeon. Here's a rant about the Shadcn component library and how over-complicated its radio buttons are: paulmakeswebsites.com/writing/shad...
(Inspired by this week's work frustrations lol)
#WebDev #CSS #HTML #JavaScript
CSS anchor positioning is newly baseline! This opens the door for lots of new creative CSS.
It's a huge feature, but here are the basics.