Using CSS Module Scripts to import stylesheets
Learn how to use CSS module scripts to import CSS stylesheets using the same syntax as JavaScript modules.
CSS
Our latest news, updates, and stories about CSS.
CSS `accent-color`
Bring your brand color to built-in HTML form inputs with one line of code.
Building a switch component
A foundational overview of how to build a responsive and accessible switch component.
User preference media features client hints headers
The Sec-CH-Prefers-Color-Scheme client hint header allows sites to obtain the user's color scheme preferences optionally at request time, allowing servers to inline the right CSS and therefore avoid a flash of incorrect color theme.
2021 Scroll Survey Report
Get the 2021 Scroll Survey Report plus words from the Chrome team about how this impacts priorities and plans for Chromium and the web.
Compat 2021 mid-year update: Flex gap everywhere
Mid-year update on Compat 2021—an effort to eliminate browser compatibility problems in five key focus areas: CSS flexbox, CSS Grid, position: sticky, aspect-ratio, and CSS transforms.
Building a breadcrumbs component
A foundational overview of how to build a responsive and accessible breadcrumbs component for users to navigate your site.
CSS `size-adjust` for `@font-face`
As a web font loads, you can now adjust its scale, to normalize the document font sizes and prevent layout shift when switching between fonts
Building a color scheme
A foundational overview of how to establish a dynamic and configurable color scheme
CSS for Web Vitals
CSS-related techniques for optimizing Web Vitals
New CSS functional pseudo-class selectors `:is()` and `:where()`
These seemingly small additions to CSS selector syntax are going to have a big impact.
The new responsive: Web design in a component-driven world
Controlling macro and micro layout in a new era of responsive web design.
Building a media scroller component
A foundational overview of how to build a responsive horizontal scrollview for TVs, phones, desktops, etc.
Building split text animations
A foundational overview of how to build split letter and word animations.
Take the 2021 scroll survey to help improve scrolling on the web
An introduction to the 2021 Scroll Survey from the Chrome team
Compat 2021: Eliminating five top compatibility pain points on the web
Google is working with other browser vendors and industry partners to fix the top five browser compatibility pain points for web developers: CSS flexbox, CSS Grid, position: sticky, aspect-ratio, and CSS transforms.
Building a Settings component
A foundational overview of how to build a settings component of sliders and checkboxes.
Building a Tabs component
A foundational overview of how to build a tabs component similar to those found in iOS and Android apps.
New aspect-ratio CSS property supported in Chromium, Safari Technology Preview, and Firefox Nightly
The new CSS property that helps maintain spacing in responsive layouts.
Building a sidenav component
A foundational overview of how to build a responsive slide out sidenav
Centering in CSS
Follow 5 centering techniques as they go through a series of tests to see which one is the most resilient to change.
Cross-browser paint worklets and Houdini.how
Supercharging your CSS with Houdini paint worklets is just a few clicks away.