# Largest Contentful Paint (LCP) Largest Contentful Paint is the time for the biggest content element to appear. It is a Core Web Vital with a good threshold up to 2.5 seconds. If it is slow, your page feels slow, users bounce, and you lose conversions. Updated 2026-09-13 · Source: https://porteur.ai/glossary/largest-contentful-paint ## What LCP means and why the 2.5 second line matters Largest Contentful Paint, LCP, is the time from page load start until the largest image or text block in the viewport is rendered. Good is up to 2.5 seconds, poor is above 4 seconds, as of 2026. Chrome calculates field performance from real user data. It uses the 75th percentile of page loads over 28 days, by URL or by origin. That is the number that counts for Core Web Vitals. For a small site, LCP is usually an image in the hero, a headline, or a poster image on a video. Fixing one template often fixes many pages at once. ## How to measure LCP, field versus lab - PageSpeed Insights: shows field data from Chrome User Experience Report when available, plus one Lighthouse lab run. - Lighthouse: lab data from a simulated mid range phone on throttled 4G. One run, scores vary between runs. - Search Console: the Core Web Vitals report groups URLs by status over the last 28 days when your site has enough data. In Lighthouse v10 and later, the Performance score weights LCP at 25 percent. Total Blocking Time and Cumulative Layout Shift also weigh heavily. Do not chase a round score. Fix what users feel first. > Field LCP is the 75th percentile over 28 days. Expect a lag after a deploy. Lab numbers help debug but do not prove the field will pass. ## Usual LCP causes on small sites - Large hero images on /, /pricing, or blog posts, served uncompressed or oversized for mobile. - Slow server time to first byte on first request, no CDN or cache. - Render blocking CSS and JS in the head, long critical path before first paint. - Web fonts blocking text render, no preconnect or font display swap. - Client side rendering of above the fold content, hydration delays push LCP out. - The LCP element is a background image hidden in CSS, so the browser picks a large text block later. Typical bad page: /pricing loads a 2400 px JPG hero, two CSS files and three JS bundles before first render. LCP shows at 4.1 seconds on mobile. ## How to improve LCP, step by step 1. **Find the LCP element on a slow page** Open PageSpeed Insights or Lighthouse. Expand the LCP audit. Note which element is marked and on which device type. 2. **Serve the right image fast** Compress and resize the hero for mobile and desktop. Use modern formats. Add width and height. Preload the exact LCP image URL if it is critical. 3. **Cut render blocking work** Inline critical CSS for the above the fold. Defer non critical CSS and JS. Remove unused scripts from the head. 4. **Speed up the first byte** Enable CDN caching for HTML where possible. Optimise server processing and database calls. Keep TLS and redirects lean. 5. **Make fonts non blocking** Preconnect to the font host. Preload the used font files. Set font-display: swap so text paints quickly. 6. **Render critical HTML on the server** If you use a client framework, server render the hero and headline. Avoid waiting for hydration to show the main content. A fixed page paints the hero text and image within 2.3 seconds on mobile with a stable layout and minimal JS before render. ## Traps to avoid when reading LCP - Mobile and desktop have separate field data. Fix mobile first. It is usually worse. - The largest element can change with layout or A B tests. Re check which element is counted after changes. - Background images in CSS are not LCP candidates. If the hero uses CSS backgrounds, the LCP may become a text block and render later. - Lab wins can hide server latency. A CDN near you will not match far users. Trust the field. - The 28 day window smooths results. You may need a few weeks to see the pass rate improve. ## Questions ### What is considered a good LCP score? Good LCP is up to 2.5 seconds. Needs improvement sits between 2.5 and 4 seconds. Poor is above 4 seconds. Aim for good on the 75th percentile. ### How do I find the LCP element on my page? Run Lighthouse and open the Largest Contentful Paint audit. It lists the element. In Chrome DevTools, Performance panel also marks the LCP candidate during a recording. ### What is LCP vs FCP vs INP in SEO terms? FCP is the time to first pixel. LCP is the time to the largest above the fold element. INP measures interaction latency and replaced First Input Delay in March 2024. All are Core Web Vitals as of 2026. ### Does LCP affect rankings? Google uses Core Web Vitals to assess user experience. Keep LCP in the good range. Focus on users first. Do not trade content quality for a tiny metric gain. ### Why does my PageSpeed score change between runs? Lighthouse is a single simulated run. Network and CPU noise cause variance. The score also weights several metrics, not just LCP. Use multiple runs and focus on field data. ### How long until field LCP improves after fixes? Field data is a 28 day rolling window. Small sites may see movement in a few days, with full effect after a few weeks. Be patient and keep traffic steady. ## Read next - [Core Web Vitals](https://porteur.ai/glossary/core-web-vitals): Core Web Vitals are Google’s three field speed and responsiveness metrics. See their thresholds, lab versus field, how to read them, and what to fix. - [Cumulative Layout Shift (CLS)](https://porteur.ai/glossary/cumulative-layout-shift): Cumulative Layout Shift is how much a page moves while loading. Keep CLS at or below 0.1. Here is how to measure, find causes, and fix them. - [Interaction to Next Paint (INP)](https://porteur.ai/glossary/interaction-to-next-paint): INP is the delay from tap to next paint, good up to 200 ms; learn how to measure it, read field versus lab data, and fix script delays. - [Core Web Vitals for a product site: the three numbers](https://porteur.ai/guides/core-web-vitals): The product founder’s guide to LCP, CLS and INP: what Google measures, why phones decide the pass, common causes, and how to test and fix. - [Largest Contentful Paint: what slows it and what fixes it](https://porteur.ai/guides/largest-contentful-paint): See what usually counts as LCP, what makes it slow, how to fix it in order, and how to read it in Lighthouse and field data. - [Lighthouse vs PageSpeed Insights: lab and field](https://porteur.ai/compare/lighthouse-vs-pagespeed-insights): Use Lighthouse for repeatable lab checks, PageSpeed Insights for real-user field data. See why scores differ and which to trust for fixes and reporting. Paste a URL to get a free check of your LCP risks and image, font and server opportunities in about thirty seconds, with three findings shown. Free check: https://porteur.ai/