The story ·
The Drop-Down Menu Can Finally Be Designed
Safari 27, released in September, lets designers restyle the drop-down menu from top to bottom. Chrome has allowed it since early 2025, so the one part of a web form that still looked like the phone or computer it ran on can now look like the website.
Almost every website with a form has one: the box you click to pick a country, a size or a delivery date, which drops open into a list. For thirty years it has been the part of the page a designer could not fully control. The browser drew it with the computer’s or phone’s own menu, so a site set in its own typefaces and colors would open onto a list in the system’s type and the system’s colors.
Safari 27, on iPhone, iPad and Mac, lets designers restyle the whole thing: the box, the list that drops open, the small arrow, and the tick beside the chosen item. Each choice in the list can now hold more than a line of text, for example a color swatch or a second line of detail, and the box can show something different once a choice has been made.
Chrome and Edge have allowed this since early 2025. Firefox has the feature built but switched off unless a user turns it on. A browser that does not support it simply shows the ordinary menu, so nothing breaks for anyone.
Apple also changed what the menu looks like before a designer touches it. Switched to the new mode, it arrives with a soft drop shadow, corners rounded by four pixels, rows tall enough for a fingertip, and a ready-made arrow and tick, in light and dark versions. The WebKit team, which builds Safari, wrote that it wanted something better “after 30 years of web developers struggling with form control styling,” and has taken the new design to the CSS Working Group, the body that writes the rules browsers follow, so that every browser can start from the same look.
It is still the real menu underneath. Keyboards, screen readers and the sending of the form all work as they always have, with no extra code. The menus sit on checkout, sign-up and booking pages, and those pages can now carry the same type, color and detail as the rest of the site.
Sources: WebKit: Features for Safari 27.0, Chrome for Developers: customizable select, MDN: customizable select elements, MDN browser support data.