Bramus

(You know the good stuff is happening on b​sk​y, right?)

Introducing Project Redraw, a new grade of 2d primitives for Web & Native

@scott_c_dev @Una Oh, good catch; thanks! I deployed a fix just now :)

cc @bramus @Una 👋 Thought you guys might want to know about this tiny event typo for the next update! ✨

Kudos to @ChromiumDev for the amazing "CSS Wrapped 2025" site! It's beautifully structured and a joy to read. ✨ Found a typo under "Invoker Commands": the text says custom commands use the toggle event, but the code correctly shows the command event. 📝👇 #WebDev #CSS

@kurtextrem @fabiospampinato A third benchmark for `:is(.matching-class):first-child` would be needed here. My expectation is that it would perform the same as the nested version, which would explain things. (Also: 76 match attempts at 0.053ms is pretty much neglible in the grand scheme of things)

@fabiospampinato @bramus this might be a topic for you, have you encountered (slow-ish) CSS nesting before?

It looks like there's a missing optimization or a bug for native CSS nesting in Chrome for some selectors 🤔 If I have some style like the following then I see the "&:first-child" and "&:last-child" bits in the selector stats (see picture below): ```css .matching-class { &:first-child { opacity: 0.2; } } ``` While if I express exactly the same thing but without native nesting I don't see these selectors in the selector stats at all anymore: ```css .matching-class:first-child { opacity: 0.2; } ``` I guess similarly to new JS features also new CSS features could not have had enough time to be fully optimized/polished 🤔 Probably worth fully resolving this stuff at compile time to be safe, I guess.

The past years I’ve done a bunch of experiments with View Transitions, such as optimizing the keyframes or driving them by scroll. I noticed I repeat a lot of code throughout those experiments … so I bundled that all up in a package. 👉 chrome.dev/view-transitio…

@UtterDonkey @Arif_hossain921 This is a known shortcoming, and looking at the comments I believe you've already found your way to the bug. issues.chromium.org/issues/4074202… The bug is currently assigned which means someone is working on it.

@Arif_hossain921 @bramus As of current testing, this doesn't work in Android. Is this the case for anyone else?

🗣️ PSA: Chrome on Android is getting an upgrade and will support edge-to-edge from Chrome 135. Here’s all you need to know to migrate your website to support edge-to-edge: developer.chrome.com/docs/css-ui/ed… (Be sure to check this guide if you have `position: fixed` content at `bottom: 0`)

@clckkkkk @theo It’s getting better and better with each build … have you tried 147 yet?

@bramus @theo trying out this feature on V146 now. i feel that the animation is still not that smooth, but it's good enough. I love vertical tabs😭

🌟 Vertical Tabs are available behind a flag in Chrome 145 (current beta) 1. Go to `chrome://flags/#vertical-tabs` 2. Set it to enabled 3. Relaunch Chrome 4. Right click the tabbar and choose “Move Tabs To The Side” Attached are before and after screenshots.

@wesbos Chrome 138 bsky.app/profile/bram.u…

When did they add this? Chrome devtools now shows the computed step values for css calc + variables Makes debugging 100x easier

More things you’ve missed: - view-transitions-mock, a non-visual polyfill for Same-Document View Transitions - Element-Scoped View Transitions excitement (see video) - All DevTools can’t properly deal with scrollbars in the Box Model. The sky is bluer on the other side 😉

Some more things you’ve missed while being here instead of there: - Dynamic connections with CSS anchor() using REAL borders demo. - Sneak Peek: Retargetable View Transitions (aka Interruptible View Transitions) demo - CSS-only Scroll-Triggered Animations

(You know the good stuff is happening on b​sk​y, right?)

@filos That’s the current Chrome Canary. (Note that using Chrome Canary as your daily driver can be risky, so maybe it’s best to wait until that version reaches Chrome Beta (or Chrome Stable))

@bramus that is not yet available...

UPDATE: Looks like the flag is no longer available in Chrome 145. You can still find it in Chrome 146 though :)

ICYWW: - Yes, you can resize the sidebar (and can even collapse it to a minimal state). - Yes, it plays nice with Tab Groups.

@kaimnsrvr Hmm, looks like the flag is no longer available in Chrome 145. You can still find it in Chrome 146 though :)

@k_grajeda @jrgarciadev Awesome! 🤩

@jrgarciadev @bramus this might interest you, view transitions being used for animations in a component library

Animating stacked toasts is usually messy. We’re using the View Transitions API instead and React Aria. Zero animation libraries. Just native browser transitions. Coming soon on HeroUI beta.4

@theo Good feedback, I appreciate it. Thanks! As for the laggy animation: have you tried Chrome 146 (current Chrome Dev and Canary) yet? AFAICT the feature is doing much better in those versions.

@bramus I've been waiting for this for so long you have no idea. Biggest request: hotkey (and customization of hotkey) for expand/collapse Also noticed the expand/collapse has an animation but it's super laggy, maybe the option to disable that? Thank you all for shipping this 🙏

@Mr_Jfranklin That would be a bug, as it goes with flagged experimental features :) I am mainly using Chrome Canary (146) which seems to do much better with this feature, so you’ll have to wait another release (or use Chrome Canary – which comes with its own challenges – or Chrome Dev)

@bramus Love this but on mine the address bar is very large. How to I make it smaller like in you images?

@Dmitry31571105 No loose nesting, but it does play nice with the Tab Groups feature.

@bramus Does it support nesting tho?

@Dalton_Walsh I’ve heard several requests about this before, so I’m sure it will please a lot of folks out there. (Personally I’m also sticking to horizontal ones … for now)

@bramus Randomly tried that today, pretty random I see this post. Not sure if like it, but it's a big change to get used to

@adamwathan Tough to hear. Hope you can turn things around.

🎧 Recorded a new morning walk this morning, hard one to share because I'm sure people will want to roast me for it but have been transparent up until now so publishing it anyways.