Saron Yitbarek

Headed to Ireland for TPAC! First time, super pumped 🥳 Give a shout if you’ll be there!

YES! FINALLY!

The Accessibility Compat Data project run by @lolaodelola.bsky.social is a vital and much-needed resource. Let's fund it. #a11y ericwbailey.website/published/th...

Read about the latest update to Safari's anti tracking: Blocking Identity Resolution Infrastructure. We will continue to prevent covert and cross-site tracking by default, while maintaining the ability for websites to provide first-party personalization to their users. webkit.org/blog/18438/b...

Did you see the news about Safari 27.0, out this week? Safari MCP 844 resolved issues Customizable select (w/ new UA default styles) <model> on iOS, iPadOS, and macOS immersive environments on visionOS sizes="auto" for easier responsive lazy-loaded images width: stretch webkit.org/blog/18325/w...

How did you find out about your favorite MCP servers?

If you've tried Safari MCP, I'd love to hear your feedback, particularly if there's more you'd like us to do with it. Any feature requests?

We recently released attr(), function(), and if() in Safari Technology Preview. Which are you most excited about?

Just tried Safari MCP in Codex. This will be useful for the web apps I’m building now, as I can finally keep the workflow in Safari rather than switching to Chromium for agent-driven debugging. Impressive work by the Apple WebKit team!

One of the surprising benefits of having a kid is how much easier it is to make friends, esp when they go to school. Birthday parties, play dates, extra curriculars, so many opportunities. Ive made so many new friends in the last year, it’s wild

I’m exploring the mental health effects of AI coding. This is a super quick (blazing fast), anonymous survey. Please fill out and share so that the responses will be well rounded. forms.gle/dpD8Tk1QnXAz...

The State of Dev's survey is now open! survey.devographics.com/en-US/survey...

UPDATE! Safari MCP now available in Safari 27 beta 🙌🏽 Give it a try and tell me what you think ❤️ webkit.org/blog/18136/i...

Small detail in the demo we love: the selected category ("Flowers") shows its icon right there in the closed dropdown, not just once you open it. That's <selectedcontent> mirroring whatever's inside the chosen <option>, available with customizable select. webkit.org/demos/custom...

The Category filter in our photo gallery demo is a 2x3 grid of icons. That's right, we put CSS Grid into a native <select>. No JS or libraries needed 🙌🏽 webkit.org/demos/custom...

At RubyConf and it’s nice to see that there are talks about AI without feeling like AI took over the conference. Nicely balanced schedule ❤️

Matz, the creator of the Ruby language, no longer reviews the code the AI generates. I know many other devs don’t either but feels different coming from a language creator. Thoughts?

Open the Color filter on our customizable select demo and the options aren't a list. They're arranged in a circle of swatches 🌈 But underneath the fancy design, it's still a native select with no JS and no libraries. Just CSS 🥰 What will you build? webkit.org/demos/custom...

light-dark() just got more powerful 🎊 Safari Technology Preview 246 adds support for using it with image values — not just colors. Swap gradients, photos, or any background image based on system appearance, no media query needed. Demo: codepen.io/ntim/pen/Pwb...

Dark mode images used to mean a prefers-color-scheme media query. In Safari Technology Preview 246, you can do it in one line: background-image: light-dark(url(light.png), url(dark.png)); Works with gradients too 🥰 Demo: codepen.io/ntim/pen/Pwb...

Hey, good news for browser extension creators. You no longer need Xcode to package and submit a Safari extension. This is good news! developer.apple.com/videos/play/... #wwdc #browsers

Another one: browser_console_messages Your agent can read your console logs on its own. Good for catching errors you didn't know were there 😅 Check out the Safari MCP server 👉🏽

It’s pretty dope. I only tried basic commands but I love the idea of using something like Claude to interact with Safari.

You already know light-dark() for colors. Safari Technology Preview 246 extends it to images. background-image: light-dark( url(light-wallpaper.png), url(dark-wallpaper.png) ); No media queries, just flip your system appearance and the image swaps ❤️ Demo: codepen.io/ntim/pen/Pwb...

Another tool in the Safari MCP server: page_interactions. Your agent can click, type, and scroll through your page — actually walk a user flow and see what breaks.

A favorite tool in the Safari MCP server? screenshot 📸 Your agent can just take a picture of your page whenever it needs to. No more copy-pasting what you're looking. Check out the Safari MCP server ❤️ webkit.org/blog/18136/i...

It was C. Model Element! 🥰

If you've got a bug that only shows up in Safari, we released something that'll make hunting it down a whole lot easier. The Safari MCP server 🙌🏽 Install it, then ask your agent something like, "Make sure this site works in Safari" and let your agent go to town. Your agent's new super power ❤️

If you code w/an agent, you know the debug dance: spot bug → open console → check styles → see what's broken → describe to your agent → hope for the best The Safari MCP server connects your agent directly to a live Safari window so it has access to the same info you do. webkit.org/blog/18136/i...

Introducing the new Safari MCP server 🎊 Connect your agent directly to a live Safari browser window so it can find bugs and examine the page on its own. Available in Safari Technology Preview 247. Details here 👉🏽 webkit.org/blog/18136/i... Give it a try and let me know what you think ❤️

You can embed Apple Maps on your website 👀 MapKit JS has been around for a while, but v6 made it easier to use: npm install, native promises, addEventListener. No custom setup or no surprises. Just install and build. Here's a demo: webkit.org/demos/yosemite

I mentioned turning 18 and going to college ONE time in passing many months ago to my toddler and now she brings it up all the time. “When I turn 18 I’m going to go to college.” She doesn’t even know what college is! 😂 Kids are funny

20s: I can be everything, everywhere, at all times 30s: I can be everything, in many places, but not all the time 40s: I can be a few things, in a few places, occasionally

Artsy graphic courtesy of image(<color>), supported as of Safari Technology Preview 246. Check out the code: codepen.io/ntim/pen/jEV... Demo by @ntim.me

Reminder: The State of CSS Survey is closing *SOON*, so **NOW** is the moment to complete it. stateofcss.com/en-US/ This survey directly influences efforts like Interop and feature planning, so this is **YOUR** moment to let browser vendors know what you find missing on the web!

I use raw CSS. For work, we are migrating away from tailwind to raw CSS. I think it's good to have that control over CSS and knowledge. Additionally, the CSS is scoped in svelte files, so makes more sense to use raw CSS. But that's my opinion and I could be wrong. Thoughts?

Just made vanilla chocolate chip ice cream with my three year old using the Kiwico ice cream kit. Wow. Can't believe how good homemade ice cream is. It was kind of a pain to make, but so worth it.

MapKit JS gives your web app the same maps and place data behind Apple Maps. Add a Place ID and you get a location's name, iconography, contact details, and hours automatically — no data management on your end. It's also privacy-first by design: no user tracking baked in. Check it out ❤️

Customizable select falls back gracefully to the native <select> in unsupported browsers — as long as your options still have text. Replace labels with swatches and icons, and those users see a dropdown full of empty options. We show you what we mean here:

The hardest part of getting started with MapKit JS used to be authentication — private keys, self-signing, token rotation. v6 cuts all of that. Generate a static token from the Apple Developer website, scope it to your domain, and you're done. Much easier 😅

Every year the web gets a little bit better, and a little more customizable, and I love it so much 😭

MapKit JS 6 ships as an npm package 🥳 ✅ npm install @apple/mapkit-loader ✅ import the loader ✅ pass your token ✅ and you're on the map. TypeScript support included via DefinitelyTyped. If you tried MapKit JS a few years ago and moved on, v6 is worth another look 👀

This Thursday, @stacykvernmo.com and I will Wing It live, looking at #CSS grid-lanes (now in WebKit/Safari). Neither of us have had a chance to actually play with it yet, and we're excited to see how it works. Come learn with us! youtube.com/live/siSCSaq...

I really struggle with icons. I assume due to my aphantasia, in my brain all blue icons lead to the same app. Please do keep the text!

Icon-only options in a customizable <select> break three things: ❌️ users who don't recognize the icon have no help ❌️screen readers have nothing to announce ❌️browsers w/o support show an empty dropdown There's just 1 fix for all three cases: keep the text Learn more:

Customizable select is so powerful -- it's fully style-able with custom arrows, icons, color swatches, rich option layouts. But to make sure everyone can enjoy it, there’s one rule to follow: always include text in your options. We show you why this rule is so important: webkit.org/blog/18117/t...

Quiz time! We published six videos on web technology for WWDC26 this year. Which do you think got the most views? A. Grid Lanes B. Web Extensions C. Model Element D. What's new in Safari 27 E. Immersive Web Environments F. Customizable Select

I'm looking for a new role in tech! 🙂 If you know any founder, publication, or company looking for a remote technical writer, developer educator, or developer advocate, I am interested! Here's a link to my resume for anyone interested: www.dropbox.com/scl/fi/6j8qz... Kindly like & reshare!

This is a great resource for learning and understanding Grid Lanes. I am already using it on a personal project. This a great scan through resource that can serve as an ongoing reference. Thanks WebKit team! gridlanes.webkit.org