---
title: "CLS (Cumulative Layout Shift)"
slug: "cls"
category: "glossary"
tags: ["glossary", "seo", "performance", "core-web-vitals", "cls"]
status: "stable"
last_updated: 2026-05-14
summary: "CLS is the Core Web Vital that measures unexpected layout movement during page load; the good threshold is under 0.1 at the 75th percentile of real users."
related:
  [
    "[[glossary/core-web-vitals]]",
    "[[seo/core-web-vitals]]",
    "[[glossary/lcp]]",
    "[[glossary/inp]]",
    "[[frontend/html]]",
    "[[frontend/css]]",
  ]
---

## Overview

This page is the atomic definition. The deep-dive lives at [[seo/core-web-vitals]].

## Definition

CLS (Cumulative Layout Shift) is the Core Web Vital that measures unexpected movement of visible page elements during load and session. It sums the largest layout-shift bursts and reports the 75th percentile across real users. The "good" threshold is under 0.1; "needs improvement" is 0.1 to 0.25; "poor" is 0.25 or more. A shift counts only when the user did not trigger it.

## When it applies

Use CLS as the layout-stability budget for any page that loads images, ads, embeds, or web fonts. It is the metric most sensitive to missing `width`/`height` attributes and late-inserted content.

## Example

A blog post measures CLS 0.32 because images load without dimensions and an ad slot pushes the text down. Adding `width="800" height="400"` to every `<img>` and reserving a fixed-height container for the ad drops CLS to 0.04.

## Related concepts

- [[glossary/core-web-vitals]] - the umbrella metric set CLS belongs to.
- [[frontend/html]] - the image and iframe rules that fix most CLS regressions.
- [[frontend/css]] - `aspect-ratio` and `content-visibility` patterns that prevent shifts.
- [[glossary/lcp]] - the loading metric, scored on a separate budget.
- [[glossary/inp]] - the responsiveness metric, scored on a separate budget.

## Citing this term

> See [[glossary/cls|CLS (Cumulative Layout Shift)]] (llmbestpractices.com/glossary/cls).

## Related

- [[seo/core-web-vitals]]
- [[frontend/html]]
- [[frontend/css]]
- [[glossary/core-web-vitals]]
- [[glossary/lcp]]
