Nazwany kolor · #4A615C
Vert Pierre
Vert Pierre to #4A615C: rgb(74 97 92), hsl(167 13% 34%), oklch(0.472 0.029 180.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Vert Pierre color name →
#4A615C
oklch(0.472 0.029 180.2)
Konwersje koloru
- HEX
- #4a615c
- RGB
- rgb(74 97 92)
- HSL
- hsl(167 13% 34%)
- HWB
- hwb(167 29% 62%)
- OKLCH
- oklch(0.472 0.029 180.2)
- OKLab
- oklab(0.472 -0.029 0)
- CIE Lab
- lab(39.14 -9.86 -0.13)
- LCH
- lch(39.14 9.87 180.7)
- CMYK
- cmyk(24% 0% 5% 62%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5B706B
- 6B7E7A
- 7D8E8A
- 8E9D9A
- A0ADAA
- B3BDBA
- C5CDCB
- D8DDDC
- ECEEED
Odcienie ciemniejsze
- 3F534F
- 354642
- 2A3936
- 202D2A
- 17211F
- 0E1514
- 060B0A
- 020303
- 000000
Tony
- 4F6460
- 556763
- 5A6A67
- 606D6A
- 65706E
- 6A7471
- 707775
- 757A79
- 7B7D7C
Harmonie kolorów
Komplementarna +180°
- 4A615C
Vert Pierre
- 6A555B
≈ Mocha Brown
Analogowa -30° +30°
- 4A615C
Vert Pierre
- 506053
≈ Siberian Green
- 496064
≈ Midnight Teal
Triada +120° +240°
- 4A615C
Vert Pierre
- 5E586A
≈ Gobelin Mauve
- 68584B
≈ Chocolate Swirl
Komplementarna rozszczepiona +150° +210°
- 4A615C
Vert Pierre
- 655663
≈ Grand Grape
- 6B5652
≈ Bourbon Truffle
Tetrada +90° +180° +270°
- 4A615C
Vert Pierre
- 555B6C
≈ Suede Indigo
- 6A555B
≈ Mocha Brown
- 625B49
≈ Suitable Brown
Kontrast i dostępność
Ag
AANa bieli
WCAG 6.65:1 · APCA Lc 83
Ag
FailNa czerni
WCAG 3.15:1 · APCA Lc 19
Najlepszy kolor tekstu: #FFFFFF
WCAG 6.65:1 (AA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--vert-pierre: #4a615c;
--vert-pierre-rgb: 74 97 92;
--vert-pierre-oklch: oklch(0.472 0.029 180.2);
}
.element {
color: var(--vert-pierre);
background-color: hsl(167 13% 34%);
border-color: oklch(0.472 0.029 180.2);
}Tailwind CSS v4
@theme {
--color-vert-pierre: #4a615c;
--color-vert-pierre-50: #edf8f6;
--color-vert-pierre-100: #deebe8;
--color-vert-pierre-200: #c8d8d5;
--color-vert-pierre-300: #a8bcb8;
--color-vert-pierre-400: #8da49f;
--color-vert-pierre-500: #728d87;
--color-vert-pierre-600: #617772;
--color-vert-pierre-700: #4d5f5b;
--color-vert-pierre-800: #384642;
--color-vert-pierre-900: #26302e;
--color-vert-pierre-950: #151d1b;
}SCSS
$vert-pierre: #4a615c;
$vert-pierre-rgb: 74, 97, 92;
$vert-pierre-light: mix(#fff, $vert-pierre, 20%);
$vert-pierre-dark: mix(#000, $vert-pierre, 20%);
.element {
color: $vert-pierre;
box-shadow: 0 0 0 2px rgba($vert-pierre, 0.35);
}