What Is LCP (Largest Contentful Paint)?

LCP, or Largest Contentful Paint, measures how long it takes for the largest visible element on a page, usually a hero image or headline, to finish rendering after the page starts loading. A good LCP is 2.5 seconds or less at the 75th percentile of real visits. It is one of Google’s three Core Web Vitals, so a slow LCP quietly drags down rankings and conversions. This guide covers what counts as your LCP element, what a good score really means, the four phases where time gets lost, and the fixes that move the number fastest. The surprising part: the biggest wins rarely come from where most teams look first.

Key Takeaways

• Largest Contentful Paint (LCP) records the moment the biggest above-the-fold element (an image, video poster, or text block) becomes visible to the user.
• A good LCP score is 2.5 seconds or less. 2.5 to 4 seconds needs improvement, and over 4 seconds is poor, judged at the 75th percentile of mobile visits.
• LCP is one of three Core Web Vitals, alongside INP and CLS, and carries the single largest weight in the Lighthouse performance score, roughly 25%.
• Every LCP time is the sum of four phases: TTFB, resource load delay, resource load duration, and element render delay.
• The three most common causes of a slow LCP are lazy-loading the LCP image, failing to preload it, and using a CSS background image as the main element.
• The highest-leverage fixes are faster delivery from a CDN, image optimization, and preloading the hero with fetchpriority set to high.
• LCP is the hardest Core Web Vitals to pass: only about 62% of mobile pages hit a good score in 2025.

What Does LCP Actually Measure?

Largest Contentful Paint is a Core Web Vitals metric that records the time from when a page starts loading to when the largest image or text block inside the viewport is rendered. In plain terms, LCP marks the moment when a visitor feels the page has actually loaded.

Older signals like load or DOMContentLoaded never captured this well, because they fire on technical events rather than on what the user sees. First Contentful Paint (FCP) helps, but it only clocks the first pixel of any content, which can be a spinner or a background color. LCP is more honest about perceived speed because it waits for the main content.

Think of LCP like judging a restaurant by when your main course lands on the table, not when the host says hello. FCP is the greeting. LCP is the meal. If you want a broader speed check first, see how to check website speed across your key pages.

What most people miss: LCP is not a score you fix once. Google reports it from real Chrome users on a rolling 28-day average (the CrUX dataset), so a fix you ship today can take three to four weeks to fully show in your field data.

What Is a Good LCP Score?

A good LCP score is 2.5 seconds or less. Between 2.5 and 4 seconds, it needs improvement, and anything over 4 seconds is poor. Google judges this at the 75th percentile of page loads, meaning 75% of your visits must meet the good threshold for the page to count as good.

Two details trip people up. First, Google measures with a throttled 4G mobile connection, so a page that flies on desktop Wi-Fi can still fail. Second, LCP is the hardest Core Web Vital to pass. According to the HTTP Archive Web Almanac, about 62% of mobile pages reached a good LCP in 2025, up from 44% in 2022, while other vitals sit higher.

Why LCP Matters for SEO and Core Web Vitals

LCP matters because it is a confirmed part of Google’s Core Web Vitals ranking signal, and it drives roughly 25% of your Lighthouse performance score, the single biggest weight of any metric. A slow LCP also increases bounce rates because users consider a page broken when the main content stalls for several seconds.

As of 2026, the three Core Web Vitals are LCP (Largest Contentful Paint), INP (Interaction to Next Paint), and CLS (Cumulative Layout Shift). INP replaced First Input Delay on 12 March 2024, so any older guide still listing FID is out of date. LCP remains the foundation because users cannot interact with content that has not yet loaded. For the full picture, our guide on what a CDN is explains how delivery speed feeds every one of these metrics.

Yes, Google describes Core Web Vitals as a modest ranking factor. But it also acts as a tiebreaker between similar pages, and its effect on bounce and conversions usually dwarfs the direct ranking nudge. Real-user monitoring studies consistently show faster LCP tracking, lower bounce rates, and higher revenue per session.

What most people miss: Passing Core Web Vitals will not vault a weak page to number one. It removes a penalty and breaks ties. Treat it as table stakes, then win on content and links.

Which Element Becomes Your LCP?

Your LCP element is the largest contentful element visible in the viewport during load. The browser reports it, and it can change as the page paints until the user interacts.

The elements eligible to be the LCP:

• Image tags, including the poster frame of an animated GIF or PNG.
• Image elements inside inline SVG.
• Video elements use the poster image or the first painted frame.
• A background image loaded through the CSS url() function.
• Block-level text such as headings, paragraphs, and list items.

Across the web, 73% of mobile LCP elements are images, which is why image handling dominates most LCP work. Chrome also excludes elements it treats as non-contentful, such as items with opacity set to 0, full-viewport backgrounds, and low-entropy placeholder images.

You might be thinking your logo is the LCP. It usually is not. On most pages, the LCP is either the hero image or the largest headline, and your build tools can confirm which one.

The 4 Phases of LCP (and Where Time Gets Lost)

A final LCP time is never one number. It is the sum of four sequential phases, and each phase needs a completely different fix.

• Time to First Byte (TTFB): how long the server takes to send the first byte of HTML. High TTFB alone can make a 2.5-second target impossible.
• Resource load delay: the gap between the first byte and the browser starting to download the LCP resource. This is usually late discovery, not slow download.
• Resource load duration: the time spent actually downloading the LCP image or font, driven by file size and connection speed.
• Element render delay: the time between the resource arriving and the browser painting it, often blocked by CSS or JavaScript.

Here is the contrarian part. For image LCPs, the silent killer is often resource load delay rather than file size. If the browser discovers your hero image late (because it is obscured by JavaScript or not referenced early in the HTML), no amount of compression will save you.

What Causes a Slow LCP?

A slow LCP traces back to one or more of a short list of causes, each mapping to one of the four phases above.

• Slow server response: underpowered hosting, uncached responses, or long distances between users and the origin inflate TTFB.
• Render-blocking CSS and JavaScript: the browser cannot paint the LCP element until it finishes parsing blocking resources.
• Oversized or wrong-format media: large hero images, unoptimized video, and heavy fonts stretch load duration.
• Heavy client-side rendering: JavaScript frameworks that build the page in the browser delay the first meaningful paint.
• Network latency: global users far from your servers wait longer for every byte.
• Traffic spikes: sudden surges overload the origin, and response times climb exactly when you have the most visitors.

The three most common specific mistakes are lazy-loading the LCP image, failing to preload it, and using a CSS background image as the main element. Lazy-loaded LCP images load about twice as slowly as preloaded ones, yet 16% of mobile sites still lazy-load their LCP image by accident. For surge protection, addressing sudden traffic spikes with the right infrastructure keeps TTFB flat when it matters most.

What most people miss: The lazy-loading attribute you added for performance can be the exact thing wrecking your LCP. Lazy-load everything below the fold, never the hero.

How to Measure LCP: Field Data vs Lab Data

You can measure LCP two ways: field data from real users and lab data from a simulated load. Google ranks on field data, so that is the number that counts, while lab data is best for debugging.

PageSpeed Insights is the fastest starting point because it shows both field and lab data for a URL. For a wider workflow across tools and metrics, our walkthrough on how to check website speed pairs well with the four-phase breakdown above.

How to Improve LCP: A Step-by-Step Optimization Guide

To improve LCP, shorten each of the four phases, starting with whichever one costs you the most time. These steps run in rough priority order for a typical image-led page.

1. Cut TTFB at the source. Move to faster hosting, cache aggressively, and put content on a secure CDN with dedicated edges close to your users so the first byte arrives quickly.
2. Keep response times flat under load. Distribute requests using an advanced load-balancing solution and a DNS load balancer so demand spreads across healthy servers rather than overwhelming a single origin during peak periods.
3. Preload and prioritize the LCP resource. Add a preload hint for the hero image and set fetchpriority to high. In a documented case, Google Flights cut its LCP by 700 milliseconds with this single change.
4. Optimize the images. Serve modern formats like WebP and AVIF, size images to their display dimensions, and use dynamic image optimization to compress them so the browser downloads the smallest viable file.
5. Never lazy-load the LCP image. Reserve loading set to lazy for content below the fold only.
6. Eliminate render-blocking resources. Inline critical CSS, defer non-critical JavaScript, and remove unused styles so the element can paint without waiting.
7. Tame web fonts. Self-host fonts, preload the ones used above the fold, and use font-display: swap so text is not invisible while fonts load.

Final Thoughts on Largest Contentful Paint (LCP)

Largest Contentful Paint rewards one thing above all: getting your most important content in front of users quickly and reliably. The teams that win at LCP stop treating it as a single score to game and start treating it as a chain, where the slowest link, whether server response, resource discovery, download, or render, sets the pace.

Fix the phase that costs you the most time first, measure with real field data, and protect those gains as traffic grows. Balance the optimization work against genuine user experience and content quality, rather than chasing a lab number; better rankings, lower bounce, and stronger conversions tend to follow on their own.

Frequently Asked Questions on Largest Contentful Paint