Couleur nommée la plus proche · #277A51
#277A51
Couleur nommée la plus proche: Opal Green
#277A51 (rgb(39 122 81), hsl(150 52% 32%), oklch(0.519 0.103 157.9)) est la plus proche de la couleur nommée Opal Green. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#277A51
oklch(0.519 0.103 157.9)
Conversions de couleur
- HEX
- #277a51
- RGB
- rgb(39 122 81)
- HSL
- hsl(150 52% 32%)
- HWB
- hwb(150 15% 52%)
- OKLCH
- oklch(0.519 0.103 157.9)
- OKLab
- oklab(0.519 -0.095 0.039)
- CIE Lab
- lab(45.5 -33.69 14.95)
- LCH
- lch(45.5 36.86 156.1)
- CMYK
- cmyk(68% 0% 34% 52%)
Teintes · Ombres · Tons
Teintes
- 418761
- 579471
- 6DA182
- 82AE93
- 96BBA4
- ABC9B6
- C0D6C8
- D5E4DA
- EAF1EC
Ombres
- 206945
- 1A593A
- 14492F
- 0E3A24
- 082B1A
- 041D10
- 021007
- 010502
- 000100
Tons
- 347B56
- 407C5B
- 497C5F
- 527D64
- 5B7E69
- 637E6D
- 6A7F72
- 727F77
- 79807B
Harmonies de couleurs
Complémentaire +180°
- 277A51
Opal Green
- 8E507D
≈ Dynamic Magenta
Analogue -30° +30°
- 277A51
Opal Green
- 57732D
≈ Loren Forest
- 007972
≈ Hydra Turquoise
Triadique +120° +240°
- 277A51
Opal Green
- 5B61A3
≈ Violet Storm
- 9A513B
≈ Tropical Nut
Complémentaire divisée +150° +210°
- 277A51
Opal Green
- 795796
≈ Juneberry
- 994D5D
≈ Haitian Flower
Tétradique +90° +180° +270°
- 277A51
Opal Green
- 316DA1
≈ Lochmara
- 8E507D
≈ Dynamic Magenta
- 8F5C19
≈ Afghan Carpet
Contraste et accessibilité
Ag
AASur blanc
WCAG 5.26:1 · APCA Lc 76
Ag
FailSur noir
WCAG 3.98:1 · APCA Lc 26
Meilleure couleur de texte: #FFFFFF
WCAG 5.26:1 (AA) · APCA Lc 76
Contrast pairs
Extraits de code
CSS
:root {
--opal-green: #277a51;
--opal-green-rgb: 39 122 81;
--opal-green-oklch: oklch(0.519 0.103 157.9);
}
.element {
color: var(--opal-green);
background-color: hsl(150 52% 32%);
border-color: oklch(0.519 0.103 157.9);
}Tailwind CSS v4
@theme {
--color-opal-green: #277a51;
--color-opal-green-50: #ddffeb;
--color-opal-green-100: #cbf3dc;
--color-opal-green-200: #afe2c5;
--color-opal-green-300: #88c8a5;
--color-opal-green-400: #66b187;
--color-opal-green-500: #3f9b6b;
--color-opal-green-600: #37835b;
--color-opal-green-700: #2c6949;
--color-opal-green-800: #204d33;
--color-opal-green-900: #153523;
--color-opal-green-950: #062012;
}SCSS
$opal-green: #277a51;
$opal-green-rgb: 39, 122, 81;
$opal-green-light: mix(#fff, $opal-green, 20%);
$opal-green-dark: mix(#000, $opal-green, 20%);
.element {
color: $opal-green;
box-shadow: 0 0 0 2px rgba($opal-green, 0.35);
}