What is first contentful paint (FCP)?

First Contentful Paint (FCP) is a metric that shows when any content first appears on the screen: text, an image, SVG, a background, and so on.

---

#What counts as "contentful"

• text blocks (even a single letter)
• images (<img>, backgrounds via CSS)
• canvas, svg
• icons, logos

Does not count: a white background, an empty <div>, a loading indicator with no content

---

#Why it matters

FCP shows when the user first sees that the page has actually started loading. This affects the perceived speed and "aliveness" of the site.

---

#Example

If FCP = 1.2 sec, the first visible element appeared on screen 1.2 seconds after the page started loading.

---

#Norms (per Google)

• < 1.8 sec: good
• 1.8-3 sec: fair

3 sec: poor

---

#Conclusion

FCP is "the moment of the first visual response". The earlier it happens, the faster the user feels the site is working.