Changelog | modern.css

Feb 24, 2026

New Launched the CSS Reference. A visual directory of 700 properties, selectors, and at-rules with live compatibility metrics.

Feb 21, 2026

Content Added Tailwind equivalents to 25 snippets: aspect-ratio, backdrop-filter, color-mix, container-queries, dynamic-viewport-units, field-sizing, fluid-typography, focus-visible, gap, has-selector, individual-transforms, inset, line-clamp, logical-properties, object-fit, overscroll-behavior, prefers-reduced-motion, scroll-snap, sticky-positioning, stretch, subgrid, text-wrap-balance, user-valid, wide-gamut, variable-fonts, and color-scheme.

New Added FAQ section to the home page. Five questions covering the site, browser support, Sass alternatives, CSS Baseline, and how the accordion itself is built. Uses native details and summary elements, no JavaScript.

Improved Added FAQPage, Organization, and SearchAction structured data schemas to the home page for better search and AI engine visibility.

Fixed Fixed BreadcrumbList schema on snippet pages. Position 2 now correctly links to the category page instead of home.

Improved Added author field to TechArticle schema on snippet pages. Articles already had this, snippets were missing it.

Improved Added OAI-SearchBot, Bytespider, and cohere-ai to robots.txt.

Improved Added og:image:alt to Open Graph meta tags.

Feb 20, 2026

Fixed Fixed external links: ctrl/cmd/shift + click now bypasses the leaving page and opens the link directly.

Fixed Fixed field-sizing baseline label from Newly available to Limited availability. Firefox 130 shipped it but cross-browser support is still limited.

Fixed Fixed accordion demo on the interpolate-size snippet page. Switched from a JS onclick toggle to native details and summary elements. No JavaScript involved in the toggle.

New Added Tailwind equivalent tab to the code comparison panel. Snippets with a Tailwind mapping now show a TW Tailwind tab alongside the Modern tab, with the class string and a usage example.

Improved Updated the Learn more about Baseline link to point to the canonical WebDX CG home page at web-platform-dx.github.io/web-features.

Improved Removed the checkmark and cross symbols from the Modern and Old code comparison labels. The labels now read Modern and Old without implying the old approach is wrong.

Improved Added a tooltip to the global usage percentage in the browser support section. Hovering shows: Percentage of browsers worldwide that support this feature.

Fixed Fixed dialog-light-dismiss, invoker-commands, and dialog-element snippets missing baseline data. All three now show the correct badge, browser icons, and support description.

Fixed Fixed oklch snippet: the tailwind field was an object instead of a string, which broke the code comparison panel entirely.

Fixed Fixed the gap property demo. The label text was appearing beside the boxes instead of below them due to both elements being direct children of the flex viewport.

Improved Added browser support fallback messages to the closedby and commandfor demos. Unsupported browsers see a notice instead of a broken or empty demo.

Improved Added accessibility notes to the carousel, scroll spy, and popover snippets. Each note covers what aria attributes and keyboard behavior still require JavaScript.

Feb 19, 2026

New Added RSS support with 3 feeds: all content (/feed/), articles (/feed/articles/), and snippets (/feed/snippets/). Feeds archive page at /feeds/. Autodiscovery link in head, RSS icon in footer.

Improved Added text-wrap: balance to all headings. No more orphaned single words on the last line.

Improved Added prefers-reduced-motion support. All transitions and animations collapse to near-instant for users who request reduced motion in their OS.

Improved Added Google Analytics preconnect hint in <head> for faster script load

Improved Added browser caching headers for static assets (1 year, immutable) and security headers (X-Content-Type-Options, X-Frame-Options, Referrer-Policy) via .htaccess

Fixed Fixed mixed content: footer newsletter social link updated from http://buttondown.email to https://buttondown.com

Improved Added og:image:type, og:image:width, og:image:height to Open Graph meta tags

Improved Fixed manifest.json icon paths from relative to absolute

Improved Extracted shared JSON cache logic into loaders/cache.helper.php. Snippets, articles, and playgrounds loaders now share one function.

Improved Removed service worker. Manifest.json still enables PWA install prompt, offline caching removed.

New Under the Hood page updated to 15 techniques (added text-wrap: balance and prefers-reduced-motion)

Feb 18, 2026

Content Added 7 new snippets: dynamic viewport units (dvh/svh/lvh), scrollbar-color + scrollbar-width, media query range syntax, linear() easing, exclusive accordions (details name), @supports feature detection, prefers-reduced-motion

New Added IndexNow support with auto-ping on content changes and cache/indexnow-log.txt for ping history

New Added CSS cache busting via filemtime query string on modern.css

Fixed Fixed update-browser-support.js SNIPPETS_DIR path (was pointing to assets/js/snippets, now correctly points to data/snippets)

New Added robots.txt entries for AI crawlers (GPTBot, ClaudeBot, PerplexityBot, Meta-ExternalAgent) and AI user agents

Feb 16, 2026

Content Added 8 new snippets: interpolate-size (height: auto animations), field-sizing (auto-growing textarea), :user-valid/:user-invalid (form validation), object-fit (responsive images), overscroll-behavior (scroll chaining), scrollbar-gutter (layout shift prevention), backdrop-filter (frosted glass), oklch (perceptually uniform colors)

New Added mobile tap-to-toggle for snippet cards — first tap reveals modern code, second tap navigates

New Added author meta to article pages: Schema.org Person structured data, rel=author link, and inline byline with avatar, social links, and publish date

New Added update-browser-support.js script to refresh all snippet usage percentages from caniuse and MDN BCD

Fixed Updated global usage percentages for 46 snippets using live caniuse + MDN BCD data (range-style-queries: 32%→88%, customizable-selects: 72%→96%, view-transitions: 78%→89%, and more)

Fixed Updated browser support percentages for interpolate-size (69%), field-sizing (73%), and :user-valid (85%)

Fixed Fixed staggered-animations snippet: corrected browser support from "widely available since 2018" to "limited availability" (Chrome 138+, Edge 138+, Safari 26.2+, no Firefox support)

Fixed Fixed staggered-animations demo to use real sibling-index() instead of PHP-set --i variables

Fixed Fixed CSS nesting explanation: bare element selectors no longer require the & prefix in relaxed nesting syntax

Fixed Clarified scrollbar-gutter explanation: overlay scrollbars on macOS and iOS are unaffected by scrollbar-gutter: stable

New Added prefers-color-scheme light mode support with full light color palette

New Changed default filter to "Newly available" so visitors see cross-browser features first

New Added AGENTS.md with modern CSS patterns for AI coding assistants

Fixed Fixed scroll-driven animations: changed from "newly" to "limited" (Firefox has not shipped support)

Fixed Fixed content-visibility: added missing Safari to browsers display list

Fixed Fixed sticky-positioning baselineYear from 2017 to 2022 (Safari 13 shipped in 2019)

Fixed Fixed wide-gamut Safari version from 15 to 15.4 (oklch support started in Safari 15.4)

Fixed Fixed line-clamp Chrome version from 6 to 14

Feb 15, 2026

New Added offcanvas mobile navigation menu with hamburger button

New Added "Browser compatibility" label to filter pills

New Added client-side year filtering on What's New archive page

New Newsletter now shows on all pages (moved to global footer)

Improved Swapped card hover behavior — old code shown by default, modern revealed on hover

Improved Hero code comparison now links to the centering snippet

Improved Browser icon CSS loaded locally instead of CDN

Content Updated llms.txt with latest site features and removed deleted snippets

Content Added changelog page

Feb 14, 2026

New Added browser compatibility filter pills (All / Widely available / Newly available / Limited) on home and category pages

New Filter state synced to URL params for shareable links

New Added Baseline description text and "Learn more about Baseline" link to browser support section

New Added global usage percentage to browser support section

New Added MDN documentation links to all snippets (47 snippets)

New Added polyfill links for scroll-animations, view-transitions, popover, text-wrap-balance, and anchor-positioning

Improved Fixed hero centering comparison: .center → .child/.parent to correctly show scope difference

Improved Restructured browser support section with left/right layout (badge + browsers)

Fixed Fixed browser support data for responsive-clip-paths (was incorrectly marked as "widely", now "limited")

Fixed Fixed missing browser icons on 13 "limited" snippets by adding baselineBrowsers data

Fixed Fixed double-encoded → arrows in 30 JSON snippet files

Fixed Fixed popover demo positioning using CSS anchor positioning

Content Removed 3 non-CSS snippets: dialog element, invoker commands, dialog light dismiss

Content Added 301 redirects for removed snippet URLs

Feb 9, 2026

New Launched modern-css.com

New CSS drops.