Convertisseur Display P3 en HSLA
Collez une valeur Display P3 et obtenez aussitôt le HSLA. Les autres formats sont acceptés aussi.
Tableau d’opacité : alpha en HEX et HSLA
En HEX à 8 chiffres, les deux derniers fixent l’opacité : FF est totalement opaque, 80 vaut environ 50 %, 00 est totalement transparent. Le tableau montre la couleur d’exemple par pas de 5 %.
| Opacité | Alpha en HEX | HEX | HSLA |
|---|---|---|---|
| 100% | ff | #ff5733 | hsla(10.59, 100%, 60%, 1) |
| 95% | f2 | #ff5733f2 | hsla(10.59, 100%, 60%, 0.95) |
| 90% | e6 | #ff5733e6 | hsla(10.59, 100%, 60%, 0.9) |
| 85% | d9 | #ff5733d9 | hsla(10.59, 100%, 60%, 0.85) |
| 80% | cc | #ff5733cc | hsla(10.59, 100%, 60%, 0.8) |
| 75% | bf | #ff5733bf | hsla(10.59, 100%, 60%, 0.75) |
| 70% | b3 | #ff5733b3 | hsla(10.59, 100%, 60%, 0.7) |
| 65% | a6 | #ff5733a6 | hsla(10.59, 100%, 60%, 0.65) |
| 60% | 99 | #ff573399 | hsla(10.59, 100%, 60%, 0.6) |
| 55% | 8c | #ff57338c | hsla(10.59, 100%, 60%, 0.55) |
| 50% | 80 | #ff573380 | hsla(10.59, 100%, 60%, 0.5) |
| 45% | 73 | #ff573373 | hsla(10.59, 100%, 60%, 0.45) |
| 40% | 66 | #ff573366 | hsla(10.59, 100%, 60%, 0.4) |
| 35% | 59 | #ff573359 | hsla(10.59, 100%, 60%, 0.35) |
| 30% | 4d | #ff57334d | hsla(10.59, 100%, 60%, 0.3) |
| 25% | 40 | #ff573340 | hsla(10.59, 100%, 60%, 0.25) |
| 20% | 33 | #ff573333 | hsla(10.59, 100%, 60%, 0.2) |
| 15% | 26 | #ff573326 | hsla(10.59, 100%, 60%, 0.15) |
| 10% | 1a | #ff57331a | hsla(10.59, 100%, 60%, 0.1) |
| 5% | 0d | #ff57330d | hsla(10.59, 100%, 60%, 0.05) |
| 0% | 00 | #ff573300 | hsla(10.59, 100%, 60%, 0) |
Exemples de conversion Display P3 en HSLA
À propos de Display P3 et HSLA
Display P3 est le gamut étendu des écrans Apple récents et de nombreux smartphones. Il couvre environ 25 % de couleurs de plus que le sRGB et s’écrit color(display-p3 r g b).
HSLA, c’est le HSL avec un canal alpha pour l’opacité, écrit hsla(11, 100%, 60%, 0.5). L’alpha va de 0 (totalement transparent) à 1 (totalement opaque), et le CSS moderne l’accepte aussi dans hsl().
Comment fonctionne la conversion
Nous lisons la valeur Display P3, la convertissons en CIE XYZ avec les matrices de la spécification CSS Color 4, puis en HSLA. Les valeurs hors du gamut cible sont ramenées par l’algorithme de CSS Color 4, qui conserve la clarté et la teinte et réduit le chroma.
Questions et réponses
Comment convertir Display P3 en HSLA ?
Collez ou saisissez une valeur Display P3 dans le champ ci-dessus. PickShade la convertit au fil de la saisie avec les formules CSS Color 4, et un clic copie la valeur HSLA.
La conversion Display P3 en HSLA est-elle exacte ?
Le calcul est exact et le résultat n’est arrondi que pour l’affichage, avec assez de décimales pour revenir à la même couleur. Si la couleur n’entre pas dans le gamut cible, PickShade vous prévient et affiche la couleur la plus proche qui y entre.
Puis-je obtenir d’autres formats en même temps ?
Oui. Tous les autres formats, dont OKLCH, Display P3, Tailwind, SwiftUI, Flutter et Android, sont listés sous le résultat et se copient en un clic.
Ce convertisseur est-il gratuit ?
Oui. Il est gratuit, sans inscription, et fonctionne entièrement dans votre navigateur.