Achtergrond kleur in CSS is anders dan de kleur van een image

Een probleem waar ik al langer mee zat. Wanneer je een achtergondverloop in een div hebt, dan vul je de rest van de div met een background color, deze haal je op door te meten met het pipetje in Photoshop. er is dan echter een kleurverschil:

Dit blijkt het gevolg te zijn van het gebruik van een kleurprofiel. Het kleurprofiel zorgt ervoor dat op alle monitoren dezelfde kleur rood wordt weergegeven (tenminste als deze gekalibreerd zijn, nog zoiets...). Op zich heel handig, maar dit gebeurt dus NIET met de background-color definitie in CSS. Daardoor ontstaat er op een gekalibreerde monitor een verschil zoals hierboven te zien is.

Oplossing is dus om het kleurprofiel uit de afbeelding te verwijderen. Dit doe je als volgt:

Open de afbeelding in Photoshop. Krijg je een profielwaarschuwing, kies er dan voor om kleurmanagement NIET te gebruiken, anders dan veranderen de RGB kleuren weer.

Meet de juiste RGB waarde met het pipetje en sla dan op voor web. Kies ervoor om GEEN profiel in te sluiten:

Nu wordt de kleur niet aangepast aan de monitor, technisch gezien niet zoals het hoort, maar je hebt wel een consequente achtergrond!