iiinova — where your digital self keeps evolving

Reposted by Saron Yitbarek

Jen Simmons @jensimmons.bsky.social · 18/09/2026

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...

webkit.org

WebKit Features for Safari 27.0

Our Safari release notes have never been as long as they are for this version.

5576

Saron Yitbarek @saron.bsky.social · 04/09/2026

How did you find out about your favorite MCP servers?

020

Saron Yitbarek @saron.bsky.social · 25/08/2026

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?

3100

Saron Yitbarek @saron.bsky.social · 19/08/2026

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

6161

Reposted by Saron Yitbarek

Marcus Anthony @marcusanthony.com · 18/08/2026

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!

151

Saron Yitbarek @saron.bsky.social · 02/08/2026

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

0120

Reposted by Saron Yitbarek

Scott Tolinski @tolin.ski · 31/07/2026

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...

forms.gle

AI Coding & Mental Health

All answers are anonymous.

1810964

Reposted by Saron Yitbarek

Kevin Powell @kevinpowell.co · 29/07/2026

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

survey.devographics.com

State of Devs 2026

Take the State of Devs survey

01610

Saron Yitbarek @saron.bsky.social · 15/07/2026

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...

040

Saron Yitbarek @saron.bsky.social · 14/07/2026

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...

2140

Saron Yitbarek @saron.bsky.social · 14/07/2026

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 ❤️

080

Saron Yitbarek @saron.bsky.social · 14/07/2026

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?

761

Saron Yitbarek @saron.bsky.social · 13/07/2026

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...

040

Saron Yitbarek @saron.bsky.social · 10/07/2026

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...

codepen.io

CSS light-dark(<image>, <image>)

...

1347

Saron Yitbarek @saron.bsky.social · 09/07/2026

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...

codepen.io

CSS light-dark(<image>, <image>)

...

070

Reposted by Saron Yitbarek

Paweł Grzybek @pawelgrzybek.com · 09/07/2026

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

developer.apple.com

Create web extensions for Safari - WWDC26 - Videos - Apple Developer

Get started with Safari web extensions by building and testing one from the ground up — no Xcode required. Explore how content blocking,...

064

Saron Yitbarek @saron.bsky.social · 09/07/2026

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 👉🏽

051

Reposted by Saron Yitbarek

Lex @thelextimes.bsky.social · 07/07/2026

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

011

Saron Yitbarek @saron.bsky.social · 08/07/2026

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...

codepen.io

CSS light-dark(<image>, <image>)

...

091

Saron Yitbarek @saron.bsky.social · 08/07/2026

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.

050

Saron Yitbarek @saron.bsky.social · 07/07/2026

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...

webkit.org

Introducing the Safari MCP server for web developers

In Safari Technology Preview 247, we’re introducing the Safari MCP server — a Model Context Protocol server for web developers that makes your web development and debugging workflow faster and more…

2102

Saron Yitbarek @saron.bsky.social · 03/07/2026

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 ❤️

1121

Saron Yitbarek @saron.bsky.social · 02/07/2026

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...

webkit.org

Introducing the Safari MCP server for web developers

080

Saron Yitbarek @saron.bsky.social · 01/07/2026

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 ❤️

webkit.org

Introducing the Safari MCP server for web developers

710722

Saron Yitbarek @saron.bsky.social · 30/06/2026

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

1172

Saron Yitbarek @saron.bsky.social · 26/06/2026

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

050

Reposted by Saron Yitbarek

Zach Leatherman @zachleat.com · 23/06/2026

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

4602

Saron Yitbarek @saron.bsky.social · 23/06/2026

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

Four different colored rectangles in a black square

022

Reposted by Saron Yitbarek

Bramus @bram.us · 22/06/2026

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!

Promotional Image for the State of CSS Survey 2026

1159

Reposted by Saron Yitbarek

shivan.xyz @shivan.xyz · 20/06/2026

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?

041

Saron Yitbarek @saron.bsky.social · 20/06/2026

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.

070

Saron Yitbarek @saron.bsky.social · 19/06/2026

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 ❤️

0141

Saron Yitbarek @saron.bsky.social · 18/06/2026

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:

webkit.org

The golden rule of Customizable Select

Customizable select is coming to Safari 27.

010

Saron Yitbarek @saron.bsky.social · 17/06/2026

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 😅

webkit.org

Discover MapKit JS 6: Rebuilt for Today’s Web Developer

MapKit JS allows you to bring the power and simplicity of Apple Maps to your website or web app.

020

Reposted by Saron Yitbarek

Mr. Hands is making SuccuDeck 😈🃏 @mrhands31.bsky.social · 17/06/2026

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

051

Saron Yitbarek @saron.bsky.social · 16/06/2026

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 👀

webkit.org

Discover MapKit JS 6: Rebuilt for Today’s Web Developer

MapKit JS allows you to bring the power and simplicity of Apple Maps to your website or web app.

0242

Reposted by Saron Yitbarek

Mia [data-css=poetic] @miriam.codes · 16/06/2026

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...

youtube.com

Grid Lanes: the Future of Masonry Layout

YouTube video by Winging It

1187

Reposted by Saron Yitbarek

Rachel Andrew @rachelandrew.co.uk · 16/06/2026

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!

1184

Saron Yitbarek @saron.bsky.social · 16/06/2026

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:

webkit.org

The golden rule of Customizable Select

Customizable select is coming to Safari 27.

15418

Saron Yitbarek @saron.bsky.social · 15/06/2026

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...

webkit.org

The golden rule of Customizable Select

Customizable select is coming to Safari 27.

1338

Saron Yitbarek @saron.bsky.social · 15/06/2026

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

520

Reposted by Saron Yitbarek

Sunkanmi Fafowora @sunkanmifafowora.bsky.social · 15/06/2026

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!

dropbox.com

01010

Reposted by Saron Yitbarek

Jeff Bridgforth @jeffbridgforth.com · 11/06/2026

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

gridlanes.webkit.org

The Field Guide to CSS Grid Lanes

Learn Grid Lanes to create masonry layouts in pure CSS. Absorb the possibilities with the Field Guide’s interactive playground. Return to the cheat sheet. Get inspired by six real examples with dozens...

0155

Saron Yitbarek @saron.bsky.social · 12/06/2026

In visionOS 27, a webpage can open a full immersive spatial experience. We cover the Immersive API, how it's similar to the Fullscreen API, and what goes into designing an experience that feels right in that environment.

developer.apple.com

Explore immersive website environments in visionOS - WWDC26 - Videos - Apple Developer

Transport your website's visitors into virtual environments in Apple Vision Pro using the new Immersive API in JavaScript. Explore how to...

140

Reposted by Saron Yitbarek

Jason Grigsby @gri.gs · 11/06/2026

Speaking of Safari team, they put together a fantastic 9 minute video introduction to customizable selects. It's a bite-sized intro that does a great job covering the new syntax. developer.apple.com/videos/play/...

developer.apple.com

Rediscover the HTML select element - WWDC26 - Videos - Apple Developer

Learn how to unlock full control of styling select menus on the web. The HTML select element is getting a major upgrade with a new CSS...

0283

Saron Yitbarek @saron.bsky.social · 12/06/2026

You no longer need Xcode or a Mac to publish a Safari extension. The Safari web extension packager in App Store Connect handles it from any browser and any OS. We cover the full process.

developer.apple.com

Create web extensions for Safari - WWDC26 - Videos - Apple Developer

Get started with Safari web extensions by building and testing one from the ground up — no Xcode required. Explore how content blocking,...

1130

Saron Yitbarek @saron.bsky.social · 11/06/2026

If you've been meaning to try Grid Lanes, we've got the perfect field guide for you. ✨️ gridlanes.webkit.org ✨️ It's got an interactive playground, SIX gorgeous demos, simple explanations, helpful tips -- everything you need to get started. We hope you have fun with it! ❤️

gridlanes.webkit.org

The Field Guide to CSS Grid Lanes

Learn Grid Lanes to create masonry layouts in pure CSS. Absorb the possibilities with the Field Guide’s interactive playground. Return to the cheat sheet. Get inspired by six real examples with…

042

Saron Yitbarek @saron.bsky.social · 11/06/2026

The <model> element comes to iOS, iPadOS, and macOS in Safari 27 🥳. We cover where to get 3D models, how to optimize them, how to write the markup, and how to use the JS API for animation and rotation.

developer.apple.com

Get started with the HTML Model Element - WWDC26 - Videos - Apple Developer

Learn how the model element brings interactive 3D content to your websites — now on iOS, iPadOS, macOS, and visionOS. Discover tools for...

040