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 · 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
3,543 of 94,748
1.6s
median LCP with it
1.5s
median LCP without
94,748
sites measured
phone field data

3.7% of sites still pull CSS through @import.

The State of Web Vitals · Q1 2026 · 94,910 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 (3,543 of 94,748). With use: INP 120ms, 87.2% pass. Without: INP 97ms, 92.2% pass. Correlates with +23ms INP and −5.0 pp pass rate. computed

The State of Web Vitals · Q1 2026 · 94,910 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: 82% pass with it, 82% without.

The gap is bigger on INP: 87% pass with it, 92% 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