The State of Web Vitals

Uses @import

Whether any stylesheet pulls more CSS via @import - a serial request chain.

Field data PhoneDesktopAll Scope All sites Q2 2026 edition · Phone field outcomes
Metric LCP INP CLS
1

At a glance the headline numbers for Uses @import

Whether any stylesheet pulls more CSS via @import - a serial request chain.

3.7%
of sites have it
6,756 of 180,684
1.7s
median LCP with it
1.6s
median LCP without
180,684
sites measured
phone field data

3.7% of sites still pull CSS through @import.

The State of Web Vitals · Q2 2026 · 189,915 sites · phone field datacorewebvitals.io/state-of-cwv
2

Uses @import sites that have it vs sites that don't

Uses @import
3.7%

3.7% of sites use CSS @import (6,756 of 180,684). With use: LCP 1.7s, 81.3% pass. Without: LCP 1.6s, 81.7% pass. Correlates with +103ms LCP and −0.4 pp pass rate. computed

The State of Web Vitals · Q2 2026 · 189,915 sites · phone field datacorewebvitals.io/state-of-cwv
3

Why this matters for the Core Web Vitals, and where to start fixing it

@import inside a stylesheet is a serial chain. The browser downloads the first stylesheet, parses it, finds the @import, and only then requests the next file. Each level adds a full round trip to the render-blocking path, and the page paints nothing until the chain resolves.

It survives in old themes and design systems because it looks harmless. Replace it with link tags, which download in parallel, or bundle at build time into one file. There is no defensible use of @import on the request path.

How does @import affect the Core Web Vitals?

Having it makes no measurable difference to the LCP: 81% pass with it, 82% without.

Go fix it Eliminate render-blocking resources → Avoid chaining critical requests →
Related signals Scripts per page → Image dimensions set → DOM depth → Script initiator → Chrome field data from 189,915 sites, representing millions of real page loads · How we measured