Every year a new set of CSS features crosses the line from "supported somewhere" to "supported everywhere that matters." The 2026 batch is unusually practical — less about visual novelty, more about removing JavaScript and workaround code that's been standard practice for years.
What "Baseline" actually means
Baseline is the web platform's shared answer to "can I use this yet?" A feature reaches Baseline once it works consistently across the major browser engines, without a polyfill or fallback. "Baseline 2026" refers to the features that newly cleared that bar this year — safe to rely on for most audiences, though still worth checking against your specific analytics if you support notably older browsers.
Relative color syntax reaches full support
Deriving a lighter, darker, or more transparent version of a brand color used to mean either maintaining a second set of color variables by hand or reaching for a preprocessor. Relative color syntax — oklch(from var(--brand) l c h / 0.5)-style expressions, alongside color-mix() — now works natively across major browsers. You can define one source color and derive every variant from it directly in CSS, which is a meaningful simplification for any brand-driven design system.
Entry animations without JavaScript timing hacks
@starting-style lets an element animate in from display: none or content-visibility: hidden without the usual trick of adding a class on the next animation frame to force a transition to fire. A modal, toast, or dropdown can now define its "before it appears" state directly in CSS, and the browser handles the timing. It's a small API, but it deletes a category of fragile JavaScript that's been a recurring source of animation bugs — timing races, flashes of unstyled content, and janky first-paint transitions.
None of these features demand an immediate rewrite. The ones worth adopting first are the ones already deleting code you maintain by hand — relative color variables and JavaScript-driven entry transitions are the clearest wins.
The shape() function for custom paths
The shape() CSS function defines custom paths for clip-path and offset-path using readable commands — move, line, curve — with direct access to CSS units and math functions like calc(). Compared to hand-written SVG path data or a polygon of raw coordinate pairs, it's dramatically easier to read, adjust, and make responsive. This is directly relevant to the kind of custom shapes and section dividers that come up constantly in brand and interface design work.
Scrollbar styling, standardized
scrollbar-width and scrollbar-color are now standard properties that work consistently across browsers, replacing a patchwork of vendor-prefixed pseudo-elements that behaved differently everywhere. If a design calls for a thin or brand-colored scrollbar — a common ask on content-heavy sidebars and code blocks — it no longer requires browser-specific overrides that quietly broke on whichever engine you tested last.
Baseline now shows up right in DevTools
Chrome DevTools now surfaces Baseline status directly in the Elements panel: hovering a CSS property shows whether it's Widely or Newly available, and since when. That closes a real gap — previously, checking whether a property was safe to ship meant leaving the browser entirely to check a compatibility table. Now the answer is one hover away from the code you're actually editing.
How to adopt this without regret
"Newly available" in Baseline terms means the feature works in the current versions of major browsers — it doesn't retroactively cover users on older versions who haven't updated. Before reaching for any of these in a client project, check the feature against your actual traffic's browser mix, same as you would for any other technique covered in our responsive design checklist. For most modern marketing and product sites, all four features above are safe today; for a site with a large legacy-browser audience, treat them as progressive enhancement rather than a foundation.
This article is an original summary based on web.dev's Baseline documentation and the Baseline-in-DevTools announcement.