Concept
Image Color Profiles Explained: sRGB, P3, and ICC
Color profiles define how an image's color data maps to actual colors on screen — mismatched profiles cause photos to look washed out or oversaturated depending on the viewer.
What is a color profile?
A color profile (also called a color space or ICC profile) is a mathematical description of how the numbers stored in an image file map to real-world colors. The RGB values in a pixel (e.g., R:220, G:50, B:50) don't inherently mean "this specific shade of red" — they mean different actual colors depending on which color space they're interpreted in.
Color profiles solve the problem of color consistency across different devices, applications, and output media. Without them, the same image file would look different on every screen, printer, and application that renders it.
ICC (International Color Consortium) profiles are the universal standard format for color profiles. They are small data files that can be embedded in image files (JPEG, PNG, TIFF, WebP) to tell any color-managed application how to correctly interpret and display the image's colors.
Common color spaces
| Color space | Gamut size | Primary use | Notes |
|---|---|---|---|
| sRGB | Standard | Web, consumer screens, office printers | The web standard; assumed default |
| Adobe RGB | ~35% larger than sRGB | Professional photo printing, prepress | More cyan-to-green range for print |
| Display P3 | ~25% larger than sRGB | Apple devices, modern wide-gamut displays | iPhone camera default since iPhone 7 |
| Rec. 2020 | ~75% larger than sRGB | HDR video, 4K/8K content | Most displays can't fully reproduce it yet |
| CMYK | Different gamut | Offset printing, prepress | Not RGB-based; for print workflows |
Why sRGB matters for the web
sRGB is the assumed color space for web content. When a browser renders an image without an embedded ICC profile, it assumes the image is sRGB. When a browser encounters an image with an embedded profile, it converts from that profile to the display's color space for rendering.
The critical issue: if you capture a photo in Adobe RGB or shoot with an iPhone (which captures in Display P3), and export it without converting to sRGB, the embedded non-sRGB profile (or lack of profile) can cause problems:
- With profile embedded: Color-managed browsers (Chrome, Safari, Firefox with color management) display it correctly. Non-managed environments (some email clients, old apps) display it washed out.
- Without profile embedded: The browser assumes sRGB. Since the data is actually Adobe RGB or P3, colors are rendered incorrectly — greens and cyans typically look less saturated, and overall the image appears flat.
The safe rule: always convert to sRGB before exporting images for web use.
Wide color gamut and iPhone P3 photos
Modern iPhones capture photos in Display P3, a color space that covers about 25% more colors than sRGB. On an iPhone or iPad with a P3 display viewed in a color-managed app (like iOS Photos), these photos look vivid and richly saturated.
When you share a P3 iPhone photo on the web without converting to sRGB, two things can happen:
- Color-managed browsers (Chrome, Safari 14+, Firefox): They read the embedded P3 profile and render the expanded colors correctly on P3 displays, or map them to sRGB on standard displays. Colors look good.
- Non-managed environments: The P3 values are interpreted as sRGB, causing the colors to look less saturated — the image looks "washed out."
For maximum consistency, convert P3 iPhone photos to sRGB before web publishing. The very best saturated colors may look slightly less vivid in sRGB, but the image will render consistently across all devices and apps.
ICC profiles in image files
ICC profiles can be embedded in JPEG, PNG, TIFF, WebP, and AVIF files. The profile is stored as a chunk of data in the file's metadata — it does not affect pixel values, only how those values are interpreted.
Typical profile sizes:
- sRGB IEC61966-2.1: ~3 KB (small)
- Adobe RGB (1998): ~560 bytes (tiny)
- Display P3: ~540 bytes (tiny)
The size overhead is minimal and generally not worth stripping for profile accuracy reasons. However, some image optimization tools strip ICC profiles as part of metadata removal.
Practical workflow
- For web delivery: Convert to sRGB in your editing software before exporting. In Photoshop: Edit → Convert to Profile → sRGB. In Lightroom: Export with sRGB color space.
- For print delivery: Stay in Adobe RGB or convert to the printer's target CMYK profile. sRGB is not ideal for professional print — it doesn't capture the full range of colors achievable on high-quality print substrates.
- Stripping profiles: Safe to strip the profile from sRGB images (browser assumes sRGB by default) — saves 3–10 KB. Not safe to strip profiles from non-sRGB images without converting first.
- For HDR content: Rec. 2020 / HDR10 profiles require both HDR displays and HDR-capable rendering paths. Standard web pages do not support HDR images yet.
Frequently asked questions
Why do my photos look washed out in some browsers?
This is almost always a color profile mismatch. Your photos are likely saved in Adobe RGB or Display P3, which has a wider color gamut than sRGB. Browsers that don't honor embedded ICC profiles will display the file's raw data using sRGB assumptions, which maps the wider colors incorrectly. The fix: convert your images to sRGB before publishing to the web.
Should web images be sRGB?
Yes. sRGB is the standard color space for the web. All web browsers and most displays use sRGB as the baseline. Images in other color spaces (Adobe RGB, P3) may look correct in color-managed applications but will look washed out or oversaturated in browsers or apps that don't apply color management. Convert to sRGB before exporting for web delivery.
What is a wide color gamut and does it matter?
Color gamut is the range of colors that a color space can represent. Wide gamut color spaces (P3, Adobe RGB) can represent more saturated and vivid colors than sRGB. Modern iPhone cameras capture images in Display P3, which includes about 25% more colors than sRGB. If you view a P3 image on a P3-capable display in a color-managed app, you see richer colors. On sRGB displays and unmanaged apps, those extra colors are lost or distorted.
Should I strip ICC profiles from web images?
For sRGB images, stripping the ICC profile is generally safe and saves 3–10 KB per image. Since sRGB is the assumed default for the web, browsers render sRGB images correctly without an embedded profile. For non-sRGB images, do not strip the profile without converting to sRGB first — stripping an Adobe RGB or P3 profile without converting causes the colors to render incorrectly.