Core Web Vitals cheat sheet
One page with the three Core Web Vitals: what each measures, the good and poor marks, where the time goes, first fixes, related metrics, and which tool to use.
In this guide
The three at a glance
| LCP | INP | CLS | |
|---|---|---|---|
| Name | Largest Contentful Paint | Interaction to Next Paint | Cumulative Layout Shift |
| It answers | When is the main content on screen? | How fast does the page react? | Does the page jump around? |
| Good | 2.5 s or less | 200 ms or less | 0.1 or less |
| Needs improvement | 2.5 to 4 s | 200 to 500 ms | 0.1 to 0.25 |
| Poor | over 4 s | over 500 ms | over 0.25 |
| Usual cause of a poor result | A late or heavy main image, a slow server, render-blocking files | Long tasks of JavaScript on the main thread | Images, embeds, ads, fonts or banners that take space after the page starts |
| Full guide | LCP | INP | CLS |
| How to fix it | Fix slow LCP | Fix INP | Fix CLS |
How a page passes
| Rule | Detail |
|---|---|
| Real visits | Field data from Chrome users, in the Chrome UX Report. A lab test does not decide it |
| 75th percentile | Three in four visits must meet the mark |
| Per device | Mobile and desktop are separate |
| All three | One metric outside "good" means no pass |
| 28 days | A rolling window, so a fix shows in full about a month later |
Where the time goes
LCP has four parts. web.dev's guideline for a well-optimized page is that they share the time roughly like this. These are guidelines to be measured relative to each other, not absolute numbers.
| Part | Share of LCP | First thing to try |
|---|---|---|
| Time to first byte | about 40% | Cache pages, use a CDN, remove redirects |
| Resource load delay | under 10% | Put the main image in the HTML, not in CSS or script. Never lazy-load it |
| Resource load time | about 40% | Resize, compress, modern format |
| Element render delay | under 10% | Remove render-blocking files, load fonts quickly |
INP has three parts.
| Part | Meaning | First thing to try |
|---|---|---|
| Input delay | The wait until the browser can start on the handler | Less work on the page at that moment, fewer long tasks |
| Processing duration | How long your handlers run | Do less in the handler, split the work |
| Presentation delay | Time until the next frame is on screen | Smaller page structure, less layout work |
CLS comes from a short list of causes.
| Cause | First thing to try |
|---|---|
| Images and video with no size | width and height, or aspect-ratio |
| Ads, embeds and banners | Reserve the space they will fill |
| Web fonts that change the text size | Preload the key font, match the fallback font |
| Content added above what is already shown | Insert it below, or in reserved space |
| Animations that move layout | Animate transform and opacity |
The related metrics
These are not Core Web Vitals, but they point to causes.
| Metric | What it measures | Good | Poor |
|---|---|---|---|
| First Contentful Paint | When anything first appears | 1.8 s or less | over 3 s |
| Time to First Byte | When the first byte of the page arrives | 0.8 s or less | over 1.8 s |
| Total Blocking Time (lab) | Main-thread blocking between FCP and interactive. A stand-in for INP | 200 ms or less | |
| Speed Index (lab) | How quickly the visible page fills in | Judged on a scale in Lighthouse |
See FCP, TTFB, Total Blocking Time and Speed Index.
Which tool for which question
| Question | Use |
|---|---|
| Do real visitors get a good experience? | The Chrome UX Report, through PageSpeed Insights or Search Console. See the Chrome UX Report |
| Why is it slow, and what do I change? | Lighthouse, PageSpeed Insights lab section, DevTools. See Lighthouse |
| What happens on my visitors' own devices? | Real user monitoring. See real user monitoring |
| Did my change help? | Repeat lab runs, then field data after 28 days. See how to test speed changes safely |
| How do I compare with other sites? | Speed benchmarks from 2025 |
Remember
- INP replaced First Input Delay as a Core Web Vital on March 12, 2024.
- A lab score is not the same as passing.
- Fix the biggest delay first: the LCP part or the INP part that takes longest.
- Mobile usually fails first.
Check your own page
Run the free audit, then read the three marks off the report and place each in its row of the first table. Start with the one that is furthest from "good".
Sources
- Defining the Core Web Vitals metric thresholds on web.dev: the marks and the 75th percentile.
- Optimize Largest Contentful Paint on web.dev: the four parts and their guideline shares.
- Chrome UX Report methodology: real visits and the 28-day window.
- Performance chapter, Web Almanac 2025: the marks for the related metrics.
Start here
Free website audit
Live Google data for any public page: mobile and desktop.
Mobile + desktop · Lighthouse lab test · Real-user Chrome data when Google has it
Rather have this done for you? Speed optimization · Book a call