What is LCP by color depth
LCP by color depth shows the Largest Contentful Paint (LCP) grouped by the bit depth of a user's display. For example: 24-bit, 30-bit, 16-bit, or 32-bit color.
Color depth refers to how many bits are used to represent color information per pixel on a screen. While not a direct performance driver, it’s often tied to the quality of the device, graphics capability, and even OS/browser combinations - which can influence how quickly visual content is rendered.
Only bit depths detected during the selected time range are shown.
💡 Color depth is usually reported via the browser’s screen.colorDepth value. It acts more like a passive signal for display capability rather than an active factor in layout speed.
Healthy LCP by color depth sample
Should you worry
In a healthy setup, LCP is green across all color depths, especially the most common ones like 24-bit. This suggests that your page’s visuals - images, fonts, and layout are rendering well across all display types.
Most modern devices report 24-bit or 32-bit depth, so as long as those segments stay green, your user experience is solid.
Unhealthy LCP by color depth sample
If a particular color depth group (e.g. 16-bit) shows red or yellow LCP, it often points to a subset of users with older or underpowered hardware.
Typical causes of slower LCP in these groups:
Lower-end devices struggling with image decoding or rendering.
Browser limitations on older operating systems.
Fallback rendering modes due to GPU or display constraints.
Color depth can also correlate with unusual display setups (like remote desktop, embedded browsers, or virtualization environments) that affect visual performance.
Resolving unhealthy LCP by color depth
Go-to action plan to resolve an unhealthy LCP by color depth:
Ask Uxi to analyze your LCP by color depth values and suggest improvements.
Use Filters to isolate those users and cross-reference with other lenses like device type, OS, or connection speed.
Simulate LCP of the suspected lens to see if fixing it will resolve the slow LCP by color depth. If yes, this is where the resolution focus should be.
Use an automated LCP optimization tool like Navigation AI to improve your LCP by color depth values.
Once you’ve improved LCP, set an alert to be the first to know if it starts worsening again.
Try it yourself
Discover how your website performs with real user data.