Glossary

What is First Contentful Paint (FCP)?

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.

Thresholds

ScoreRating
≤ 1.8sGood
1.8s - 3.0sNeeds Improvement
> 3.0sPoor

Google recommends 1.8 seconds or less for at least 75% of page visits.

FCP vs LCP

MetricMeasuresQuestion It Answers
FCPFirst content appears"Is anything happening?"
LCPLargest 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.

Why It Matters

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.

Common Issues

  • Slow server response (TTFB)
  • Render-blocking CSS/JavaScript
  • Large CSS files blocking first paint
  • Web fonts with font-display: block

Measure FCP

FCP is a Lighthouse metric, not a Core Web Vital. Improving FCP typically improves LCP, which is a Core Web Vital and ranking factor.
Did this page help you?