TL;DR — Quick Summary
FCP measures when the first text or image becomes visible. Good FCP is ≤ 1.8 seconds at p75. While not a Core Web Vital, it's a Lighthouse metric (10% weight) and a leading indicator of LCP problems. Improving FCP means fixing the critical rendering path.
What is First Contentful Paint (FCP)?
First Contentful Paint (FCP) marks the time from navigation start to when any part of the page's content is rendered on screen. 'Content' includes text, images (including background images), SVGs, and non-white canvas elements. FCP does not fire for empty pages or pages showing only the browser's default background.
FCP differs from other paint metrics:
- •First Paint (FP) — Any pixel change, including background color. Less meaningful than FCP.
- •FCP — First meaningful content appears (text, image).
- •LCP — Largest content element finishes rendering.
FCP measures the start of the visual loading experience; LCP measures its completion. A fast FCP reassures users the page is responding, even if the full content hasn't loaded yet.
FCP Thresholds
| Metric | Good | Needs Improvement | Poor |
|---|---|---|---|
| FCP | ≤ 1.8s | 1.8s – 3.0s | > 3.0s |
Google evaluates the 75th percentile (p75) of real-user field data over a rolling 28-day window.
History & Evolution
FCP was introduced as a Paint Timing API metric and has been part of Lighthouse since its early versions.
Key milestones:
- •2017 — FCP added to Chrome via the Paint Timing API.
- •2018 — Lighthouse includes FCP as a key performance metric.
- •2020 — Core Web Vitals announced. FCP is not included as a CWV but remains in CrUX and Lighthouse.
- •2025–2026 — FCP carries 10% of the Lighthouse performance score. The 1.8-second threshold remains unchanged.
How FCP is Measured
FCP is measured via the Paint Timing API, available in all modern browsers.
Field Data: CrUX / PageSpeed Insights, Web Vitals JS library Lab Data: Lighthouse (10% of performance score), Chrome DevTools Performance panel, WebPageTest
FCP is one of the most consistent metrics to measure because it has a clear definition (first content pixel) and doesn't depend on user interaction.
Key rule: Field data (CrUX) determines Google rankings. Lab data (Lighthouse, WebPageTest) is for debugging and iteration.
Common Causes of Poor FCP Scores
- 1Slow TTFB — If the server takes 1.5s to respond, FCP cannot happen before 1.5s.
- 2Render-blocking CSS — External stylesheets in
<head>must download and parse before any content renders. - 3Render-blocking JavaScript — Synchronous scripts in
<head>block HTML parsing and rendering. - 4Large CSS files — A 200KB+ CSS file takes significant time to download and parse.
- 5Web fonts blocking text — Default font-display: block hides text until custom fonts load (FOIT).
- 6Redirect chains — Each redirect adds a full round trip before the page even starts loading.
Frequently Asked Questions
For step-by-step optimization, platform-specific fixes, code examples, and case studies, read our full guide:
The Ultimate Guide to Core Web Vitals: How to Pass All Metrics & Boost Rankings in 2026Struggling with FCP?
Request a free speed audit and we'll identify exactly what's holding your scores back.