ColorCodeV

Inspectez les couleurs à gamme étendue avec précision.

Comparez les gammes et créez un CSS progressif avec une solution de repli sRGB.

Display P3 · outside sRGB

Checking display capability…

sRGBOutside
Display P3Inside
Adobe RGBOutside
Rec. 2020Inside

The source already fits Display P3; mapping preserves it.

Position dans la gamme

Approximate CIE xy primary boundaries.

x 0.6465 · y 0.3331
SourceDisplay P3 · outside sRGB
Perceptual mappingΔE OK 0.0000
Channel clippingΔE OK 0.0000

Valeurs de couleur

Copy the source or either target-gamut conversion.

Source color#FF0000
Display P3 mappedcolor(display-p3 1 0.22 0.12)
Display P3 clippedcolor(display-p3 1 0.22 0.12)
OKLCHoklch(0.66932 0.27631 30.40046)

CSS progressif

Standard displays receive the sRGB fallback; capable browsers receive Display P3.

.wide-gamut-color {
  color: #FF4C37;
}

@supports (color: color(display-p3 1 1 1)) {
  .wide-gamut-color {
    color: color(display-p3 1 0.22 0.12);
  }
}

Inspectez les couleurs à gamme étendue avec précision.

Comparez les gammes et créez un CSS progressif avec une solution de repli sRGB.

Outils associés

Inspecteur visuel de gammePlacez les couleurs sur un diagramme CIE xy et comparez les limites des gammes d’affichage.Différence de couleurComparez deux couleurs avec des méthodes Delta E reconnues.Sélecteur de couleurChoisissez visuellement, saisissez une valeur ou prélevez une couleur à l’écran.