Baseline for CSS properties now in Chrome DevTools

Jeremy Wagner

Published: August 6, 2025

The Elements panel in Chrome DevTools is one of the most frequently used tools developers rely on to debug all sorts of information about the state of the DOM in web applications. It's most often used to debug a page's CSS, giving developers a convenient way to tweak various CSS properties to understand how changes to a page's styles affects its presentation.

One feature of the Elements panel is the ability to hover over a CSS property, and see a hover card that describes the CSS property's purpose. This feature was originally added by Alexey Rodionov, a Google Developer Expert (GDE) in Web Technologies, and added links to MDN documentation for CSS properties. Recently, Alexey extended the functionality of these hover cards to show a property's Baseline status.

Baseline support as shown in Chrome DevTools. In this case, the CSS color property is listed as Baseline Widely available.
Widely available status on the CSS color property.
Baseline support as shown in Chrome DevTools. In this case, the CSS text-wrap property is listed as Baseline Newly available.
Newly available status on the CSS text-wrap property.
Baseline support as shown in Chrome DevTools. In this case, the CSS hyphenate-limit-chars property is listed as Limited availability.
Limited availability status on the CSS hyphenate-limit-chars property.

As well as showing the Baseline status for a CSS property, these cards also describe the interoperability date for Widely or Newly available features, so you can get a quick glance at just how long a feature has been interoperable! This change has landed in version 140 of Chrome. At the time of this writing, version 140 of Chrome is currently in beta, but this feature will become available in the stable build soon!

Thanks again to Alexey Rodionov for his work on this valuable feature. We believe it will give developers an even easier way to discover feature compatibility in their debugging workflow.