Safari 26.5 Breaks New Ground with :open Pseudo-Class and Enhanced Random() Capabilities

Breaking: Apple Ships Safari 26.5 with Major CSS and WebKit Improvements

Cupertino, CA – Apple today released Safari 26.5, a significant update that introduces the :open pseudo-class, an element-scoped keyword for random(), and color interpolation for SVG gradients, alongside the ToggleEvent.source property for popovers and the Origin API. The release includes 63 bug fixes, making it the largest May update in WebKit history.

“This release delivers substantial quality improvements across SVG, WebRTC, networking, and editing,” said a WebKit spokesperson. “Our team has been laser-focused on stability and developer feedback.”

New CSS Features: :open Pseudo-Class

The :open pseudo-class provides a uniform way to style the open state of interactive elements like <details>, <dialog>, <select>, and <input>. Previously, developers relied on the [open] attribute selector, which only worked on <details> and <dialog>.

“We’ve replaced an attribute workaround with a proper pseudo-class that works across all element types,” explained a senior WebKit engineer. “For instance, :open now matches a <dialog> whether opened via showModal() or show(), and for <input> it applies when a picker is displayed.”

The progressive enhancement is seamless – unsupported browsers simply ignore the rules, while the underlying elements continue to function normally. A typical usage: select:open { border: 1px solid skyblue; } styles a dropdown when expanded.

Refined random() Function with Per-Element Control

Safari was the first browser to ship the CSS random() function in December 2024 (Safari 26.2). In response to community feedback, the CSS Working Group updated how named random values behave. Previously, using a named value like random(--size, 100px, 200px) created a result scoped to each element. Now it generates a global result across all elements, unless developers opt for per-element behavior with the new element-scoped keyword.

“This change gives developers precise control,” noted a WebKit contributor. “If you want all boxes to share the same random dimensions, you use a named value. For distinct sizes per box, omit the name or use the element-scoped keyword.”

Example: .box { width: random(100px, 200px); height: random(100px, 200px); } produces eight unique rectangles. To make all eight identical, use random(--w, 100px, 200px) for width and random(--h, 100px, 200px) for height.

Quality Improvements Across the Board

This release addresses 63 bugs, spanning SVG, WebRTC, networking, editing, and more. Scroll-driven animations and Anchor Positioning receive multiple fixes. Rendering at different zoom levels has been improved, and work continues on handling layout when a block-level element resides inside an inline element.

“Performance and stability are our top priorities,” the WebKit team emphasized. “The 63 fixes represent our biggest May effort yet.”

Background

Safari has gradually modernized its rendering engine, WebKit, focusing on CSS standards and developer ergonomics. The random() function and :open pseudo-class are part of ongoing CSS specifications. Apple’s early adoption of random() in December 2024 set the stage for these refinements.

ToggleEvent.source and the Origin API extend interactivity and security capabilities. Color interpolation for SVG gradients enhances graphic fidelity. The update aligns with Apple’s strategy of delivering incremental, high-quality releases.

What This Means

For web developers, Safari 26.5 reduces reliance on hacky attribute selectors and brings predictable randomization. The :open pseudo-class simplifies styling of interactive elements, while the refined random() function offers both global and per-element randomness. Improved SVG gradients and optimization across multiple subsystems indicate a robust, polished release.

With 63 bug fixes, Safari 26.5 sets a new benchmark for stability in May updates. Developers are encouraged to test their projects against this release, especially areas involving popovers, dialog interactions, and random layout generation.

For a full list of changes, refer to the WebKit release notes.