Sign in

Penny

@digitaltransient.bsky.social
1.4K followers 684 following 164 posts

Epic nerd. 🤓 Cat lady. 😽 PM WebUI @Google Chrome Tell me what you need from HTML & CSS! Prev: co-founder @mobify

PostsRepliesMedia
Reposted by Penny
Bramus @bram.us · 22/05/2026
Here's the recording of this year's “What's new in Web UI” talk @una.im and I gave at Google I/O earlier this week. youtu.be/uT7MVcCQ4rw Very happy with how it went, and I think you might find it useful, so give it a watch 😊 #ChromeDevRel #GoogleIO
youtu.be
What's new in Web UI
YouTube video by Chrome for Developers
15113
Reposted by Penny
Google for Developers @developers.google.com · 20/05/2026
Turn your website into an agentic toolkit 🌐 Catch the 3 big Chrome updates from #GoogleIO: 🛠️ WebMCP for agentic toolkits 🐞 Autonomous debugging via Chrome DevTools 📑 Modern Web Guidance Learn more: goo.gle/IO26-Chrome-...
0165
Reposted by Penny
Taylor Lorenz @taylorlorenz.bsky.social · 25/03/2026
It’s shocking how the motivation behind almost every single bad tech bill is about hating LGBTQ people and specifically trans people
283074598
Reposted by Penny
Bramus @bram.us · 23/03/2026
The great thing about Scroll-Driven Animations is that they work with your existing CSS animations. The framework to get started is simple: 1. Take an existing animation 2. Drop the duration 3. Set the animation-timeline to view() or scroll() scroll-driven-animations.style has a free video course
scroll-driven-animations.style
Scroll-driven Animations
A bunch of demos and tools to show off Scroll-driven Animations
1122
Reposted by Penny
Bramus @bram.us · 11/03/2026
So. Anchor Positioning and DevTools … I sat together with The Hype™ tonight and this is what we built in 2 hours. Main takeaway from this experiment is that it still requires a “Subject Matter Expert” (in this case: me) to build this, instructing The Hype™ what to do (and sometimes how to do it).
5465
Reposted by Penny
Barry Pollard @tunetheweb.com · 02/03/2026
Dear God, what have we done? Maybe adding this was a mistake? But seriously clever (mis)use of this! And surprisingly little code!
0311
Reposted by Penny
Justin Fagnani @justinfagnani.com · 10/03/2026
🎉 I'm so excited that scoped custom element registries is landing in Chrome and Edge! 🥳 This solves one of the biggest complaints with the web components APIs: the global tag name namespace. Standards is a long game though: I first proposed this in 2017! 😲 developer.chrome.com/blog/scoped-...
developer.chrome.com
Make custom elements behave with scoped registries  |  Blog  |  Chrome for Developers
You can now encapsulate custom elements.
35915
Reposted by Penny
Bramus @bram.us · 18/02/2026
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.
523037
Reposted by Penny
Una Kravets @una.im · 05/02/2026
border-shape can handle both insets and outsets, so you can do effects like this chevron nav (corner-shape can't do both). This means you get a perfectly-wrapping focus ring without needing to manage z-index or having it partially covered due to overlap. Demo: codepen.io/una/pen/ByzY...
920731
Reposted by Penny
Josh Tumath @joshtumath.uk · 27/01/2026
Excitingly, Chrome Canary recently added support for <meta name="text-scaling"> behind a flag. What is it? It's something that we're all going to start using on our websites to improve accessibility. Here's a blog post with more info. www.joshtumath.uk/posts/2026-0...
joshtumath.uk
Try text scaling support in Chrome Canary - Josh Tumath
35118
Reposted by Penny
Adam Argyle @nerdy.dev · 23/01/2026
a powerful #CSS transition technique enters the ring: Anchor Interpolated Morphing (AIM) nerdy.dev/anchor-inter...
6878
Reposted by Penny
Ian Riddler Photography @ianriddler.bsky.social · 14/12/2025
Any Port in a Storm When the storm is so full on that a mere 6 seconds is bordering on over-exposing the image! So bright. Soooo bright. - #Twizel, #NewZealand. - "Look with your eyes. See with your Soul." #Aurora #Night #Stunday #Scape #EastCoastKin #Landscape #Nightscape #Bucketlist #Travel
493820396
Penny @digitaltransient.bsky.social · 10/12/2025
What an amazing year it's been for CSS! 😅 I'm so proud of the team and all of our collaborators working on other engines for what's been accomplished in 2026. ❤️
071
Reposted by Penny
Una Kravets @una.im · 09/12/2025
Wow! Really fun, creative use of scroll-state queries, style queries, and scroll-driven animations from Lee Meyer css-tricks.com/scrollytelli...
css-tricks.com
Scrollytelling on Steroids With Scroll-State Queries | CSS-Tricks
Unconvinced of the value of scrollytelling? Alright, skeptic, let’s first warm up with some common use cases for scroll-based styling.
0162
Reposted by Penny
Bramus @bram.us · 05/12/2025
There’s a lot of cases where I needed this, so I’m very excited to seeing `random()` come to CSS. While trying it out, however, I found the caching strategy options to be very confusing … so I am proposing to rename some of the keywords: github.com/w3c/csswg-dr... Any Hot Takes™ on this?
github.com
[css-values-5] The `<random-value-sharing>` options for `random()` are confusing · Issue #13132 · w3c/csswg-drafts
I took random() for a spin and must say I struggled quite a bit with the <random-value-sharing> options. What we have now As it currently stands, the options are: auto: Each random function in an e...
392
Reposted by Penny
Henri Helvetica 🧑🏾‍🚀🇭🇹 @henrihelvetica.bsky.social · 03/12/2025
✨ Core Web Vitals Summit ✨ stream is today in just over 1hr, @ 11am, virtual doors will likely open a few minutes before. Join us! Hang out. Come hear from web performance and ux professionals. 📆 TODAY, Wed Dec 3rd ⏰ 11a EST, 5p CET 🔗 bit.ly/cwv-summit
SPY stream presents core-web-vital summit Wednesday December 3. image of eight avatars of tech professionals.
051
Reposted by Penny
Pen-a-Lope 🦌 @pennystwocents.bsky.social · 03/12/2025
A stochastic terror campaign against anyone who is trans or gender nonconforming. We wake up with this fear, and we go to bed with this fear. And it weighs on us every minute of our lives. Exactly as intended. And most institutions not only don't protect us, they protect the aggressors.
011
Reposted by Penny
Pen-a-Lope 🦌 @pennystwocents.bsky.social · 29/11/2025
Master scheduler.
Pixel, a calico rescue cat, reveals her busy agenda. Screenshot of a calendar app. 

The secret to staying so beautiful when one is so busy? Lots of nap time and grooming.
031
Reposted by Penny
Adam Argyle @nerdy.dev · 27/11/2025
love seeing all the #CSS subgrid excitement in my timeline!! def @joshwcomeau.com inspired 🤘🏻 now that your subgrid interest is piqued, checkout a post I made too‽ maybe even just for the long list of resource examples at the end web.dev/articles/css...
web.dev
CSS subgrid  |  Articles  |  web.dev
Subgrid enables grid shareability, allowing nested grids to align to ancestors and siblings.
1426
Reposted by Penny
Pen-a-Lope 🦌 @pennystwocents.bsky.social · 25/11/2025
Trying to finish my work day be like ...
Pixel, a calico rescue cat, is done waiting for love. 

Love. Now. Human.
082
Reposted by Penny
Una Kravets @una.im · 12/11/2025
Good news! Range syntax for style queries and if() functions has shipped in Chrome! Check it out: una.im/range-style-...
una.im
una.im | Range Syntax for Style Queries
Learn how to use the new range syntax for CSS style queries and the if() function.
35316
Reposted by Penny
Lea Verou, PhD @lea.verou.me · 13/11/2025
At the CSS WG meeting, we're discussing possibly natively doing fit-text in CSS. Send us your use cases (with screenshots/links)! Do you ever need to fit multi-line text? Do you ever need to fit non-text inline elements (e.g. icons)? Do you adjust font-size, letter-spacing, or both?
14448
Reposted by Penny
Norah 🤗 @thenoraheffect.bsky.social · 09/11/2025
Good morning and happy Sunday 🐴 🥰
268100181363
Penny @digitaltransient.bsky.social · 10/11/2025
TPAC 2025! Say hello if you see me there.
Selfie looking out over Kobe
030
Reposted by Penny
Pen-a-Lope 🦌 @pennystwocents.bsky.social · 05/11/2025
Just witnessed Pixel, having emerged from the cat room after taking a particularly noxious dump, sniff the air dubiously then turn tail and return to her litter box to bury matters further. Thanks for the courtesy flush, Pixel!
Courtesy flushing Calico cat
052
Reposted by Penny
Josh W. Comeau @joshwcomeau.com · 03/11/2025
✨ It’s that time of year! The State of JavaScript 2025 survey is currently running. 😄 I take the survey every year. It’s a great way to keep up with all of the new features and APIs that have come to browsers in the past year. stateofjs.com/en-US
stateofjs.com
State of JavaScript
13410
Reposted by Penny
Una Kravets @una.im · 03/11/2025
We often hear that folks want "wrap detection" in CSS (i.e. when a flex item shifts into a position where it wraps over to the next line) What is a real-world example of a use-case you would need this for?
16359
Reposted by Penny
Bramus @bram.us · 21/10/2025
I flipped the flag on this one today and it’s now enabled by default. Expect it in tomorrow’s Chrome Canary build. (If you can’t wait to try it out, you can manually flip the flag in today’s Canary/Beta/Dev builds. Go to chrome://flags and look for starting-style)
0211
Reposted by Penny
Bramus @bram.us · 03/10/2025
At #fronteers #DarkMode, @utilitybend.com proposed the <rangegroup> HTML Element. It unlocks the multi-handle range slider, a pattern you might have already seen when picking a price-range. Feedback Form (with links to the explainer and demos): docs.google.com/forms/u/0/d/...
Brecht on stage showing some of the demos.
2427
Reposted by Penny
Nordic.js @nordicjs.com · 03/10/2025
Talk about making an entrance!! 🍰✨ @una.im
1172
Reposted by Penny
Josh W. Comeau @joshwcomeau.com · 02/10/2025
I’ll be speaking in Toronto in a couple of weeks! It’ll be on animation design, and some of the cool things we can do to make our websites/webapps more whimsical. ✨ fitc.ca/event/webu25...
fitc.ca
Web Unleashed 2025 // October 21-22 // Toronto & Online
The ultimate conference for front-end dev experts
3342
Reposted by Penny
Bramus @bram.us · 02/10/2025
🤩 View Transitions excitement! Goooooo Ladybird! > This month, a lot of the underlying machinery for this has been implemented. It's going to take a bit longer before it's usable, but it's a good start to an exciting new web feature. buttondown.com/ladybird/arc...
buttondown.com
This Month in Ladybird: September 2025
September wrapped up with 207 merged PRs from 40 contributors. Let’s take a look at some highlights: Welcoming new sponsors Ladybird is entirely funded by...
0165
Penny @digitaltransient.bsky.social · 01/10/2025
Accessible CSS carousels are here! Our new post, co-authored with @flackr.bsky.social and Lucas Radaelli (x.com/lucasradaelli), walks you through building them with the new APIs. The APIs are Interop 2026 proposals, soon on their way to all browsers. 🤞 developer.chrome.com/blog/accessi...
developer.chrome.com
Make accessible carousels  |  Blog  |  Chrome for Developers
How the features in CSS Overflow 5 can help you create more accessible carousel patterns.
182
Reposted by Penny
CSS-Tricks* @css-tricks.bsky.social · 17/09/2025
There's a nice series from @sturobson.com getting into *why* and *how* to "un-Sass" CSS. www.alwaystwisted.com/articles/UnS... @jeffbridgforth.com is making a similar leap and shares how he's approaching it: css-tricks.com/is-it-time-t...
css-tricks.com
Is it Time to Un-Sass? | CSS-Tricks
Many of the Sass features we've grown to love have made their way into native CSS in some shape or form. So, should we still use Sass? This is how developer Jeff Bridgworth is thinking about it.
23511
Reposted by Penny
Paul Kinlan @paul.kinlan.me · 23/09/2025
This is such a great enhancement. Being able to have any tool that talks MCP have the ability to deeply introspect your pages is huge.
181
Reposted by Penny
Josh W. Comeau @joshwcomeau.com · 24/09/2025
We’re live!! My brand-new course, “Whimsical Animations”, is now available. 🥳🎉 whimsy.joshwcomeau.com I’m so excited to share all of my animation tools and techniques with y’all. 😄
whimsy.joshwcomeau.com
Whimsical Animations
Learn how to create charming interactions and delightful touches using the magic of CSS, JavaScript, SVG, and Canvas. I’m sharing all my tricks in this one!
17307101
Reposted by Penny
Bramus @bram.us · 24/09/2025
CSS Excitement! > RESOLVED: Add `color-scheme()` test to both `@container` queries and `if()`. github.com/w3c/csswg-dr... This means you can do a light-dark() that works with any type of value 🤩🤩 ``` background-image: if(color-scheme(dark): url(dark.svg); else: url(light.svg)); ```
github.com
[css-values-5] Using `if()` to do dark/light switching of image urls. · Issue #10577 · w3c/csswg-drafts
Please forgive me if this one's a bit vague as I'm adding an issue here at Chris Lilley's request, and I'm not familiar with the process too much. There are times when I need to swap the background...
2304
Reposted by Penny
Nicole Rust @nicolecrust.bsky.social · 24/09/2025
This is amazing! The company behind it is uniQure and it's a type of gene therapy. Does anyone know the story about the preclinical work leading up to it? It know a lot about the discovery of the HTT mutation (an amazing story!). I'm curious about this specific microRNA approach: who developed it?
Our investigational gene therapy candidate AMT-130 consists of an AAV5 vector carrying an artificial micro-RNA specifically tailored to silence the huntingtin gene, leveraging our proprietary miQURE™ silencing technology. The therapeutic goal is to inhibit the production of the mutant protein (mHTT). Using AAV vectors to deliver micro-RNAs directly to the brain for non-selective knockdown of the huntingtin gene represents a highly innovative and promising approach to treating Huntington’s disease.
25311
Reposted by Penny
johnphamous @handle.invalid · 23/09/2025
guidelines for building interfaces on the web interactions, animations, layout, content, forms, performance, design & copywriting includes an AGENTS​.md
1244
Reposted by Penny
Toronto Boris @torontoboris.bsky.social · 23/09/2025
Memories of Fiery sunsets. Grundy, Ontario Sept 2016 #WeekMforMemories #AlphabetChallenge #EastCoastKin #sunset #ShareCanGeo #blueskyphotography #GrundyPP
692646238
Reposted by Penny
IntentToShip @intenttoship.dev · 18/09/2025
Blink: Intent to Ship: Interest Invokers (the `interestfor` attribute)
groups.google.com
Blink: Intent to Ship: Interest Invokers (the `interestfor` attribute)
Blink: Intent to Ship: Interest Invokers (the `interestfor` attribute)
093
Reposted by Penny
IntentToShip @intenttoship.dev · 03/09/2025
Blink: Intent to Ship: :target-before and :target-after pseudo-classes
groups.google.com
Blink: Intent to Ship: :target-before and :target-after pseudo-classes
Blink: Intent to Ship: :target-before and :target-after pseudo-classes
062
Reposted by Penny
IntentToShip @intenttoship.dev · 08/09/2025
Blink: Intent to Prototype: Overscroll Gestures
groups.google.com
Blink: Intent to Prototype: Overscroll Gestures
Blink: Intent to Prototype: Overscroll Gestures
062
Reposted by Penny
IntentToShip @intenttoship.dev · 11/09/2025
Blink: Intent to Ship: Respect overscroll-behavior on non-scrollable scroll containers
groups.google.com
Blink: Intent to Ship: Respect overscroll-behavior on non-scrollable scroll containers
Blink: Intent to Ship: Respect overscroll-behavior on non-scrollable scroll containers
022
Reposted by Penny
Una Kravets @una.im · 15/09/2025
To do this with the (upcoming) interest invoker API, it's 1 line of code: .parent:has(:interest-source) button { interest-show-delay: 0s; } You have your default delay. Then, you update the interest delay when an element inside of the parent has interest (i.e. hover). codepen.io/una/pen/LEpw...
116418
Reposted by Penny
Jen Simmons @jensimmons.bsky.social · 15/09/2025
Safari 26 is here!!! Anchor Positioning, Scroll-driven animations, High Dynamic Range images, the new HTML <model> element, the all-new Digital Credentials API, SVG icon support, WebGPU, WebKit in SwiftUI, every site can be a web app on iOS and iPadOS, and much more. webkit.org/blog/17333/w...
webkit.org
WebKit Features in Safari 26.0
We’re happy to share with you what’s arriving in Safari 26.0!
714030
Reposted by Penny
Dongmei Li @dongmei960.bsky.social · 12/09/2025
Lotus #photography #flowers #plants #blossom #BloomScrolling
216314
Penny @digitaltransient.bsky.social · 10/09/2025
Concurrent View Transitions is a huge unlock, please kick the tires on these and give us feedback!
090