First Contentful Paint (FCP) measures when the browser renders the first piece of content - text, image, SVG, or canvas element. It answers "is anything happening?" and contributes 10% to your Lighthouse score.
| Score | Rating |
|---|---|
| ≤ 1.8s | Good |
| 1.8s - 3.0s | Needs Improvement |
| > 3.0s | Poor |
Google recommends 1.8 seconds or less for at least 75% of page visits.
| Metric | Measures | Question It Answers |
|---|---|---|
| FCP | First content appears | "Is anything happening?" |
| LCP | Largest content appears | "Is the main content loaded?" |
A page can have fast FCP (spinner appears) but slow LCP (actual content takes longer). Both matter for UX.
FCP marks when users perceive the page is loading. Before FCP, they see only a blank screen. Fast FCP reassures users something is happening, reducing early abandonment.
font-display: block