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 Q1 2026 edition · All devices 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
3,543 of 94,748
1.6s
median LCP with it
1.5s
median LCP without
94,748
sites measured
all-device field data

3.7% of sites still pull CSS through @import.

The State of Web Vitals · Q1 2026 · 94,910 sites · all devices 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 (3,543 of 94,748). With use: LCP 1.6s, 81.8% pass. Without: LCP 1.5s, 82.8% pass. Correlates with +111ms LCP and −1.0 pp pass rate. computed

The State of Web Vitals · Q1 2026 · 94,910 sites · all devices 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: 82% pass with it, 83% 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 94,910 sites, representing millions of real page loads · How we measured