Najbliższy nazwany kolor · #006764
#006764
Najbliższy nazwany kolor: Peacock Pride
#006764 (rgb(0 103 100), hsl(178 100% 20%), oklch(0.464 0.08 191.3)) jest najbliższy nazwanemu kolorowi Peacock Pride. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#006764
oklch(0.464 0.08 191.3)
Konwersje koloru
- HEX
- #006764
- RGB
- rgb(0 103 100)
- HSL
- hsl(178 100% 20%)
- HWB
- hwb(178 0% 60%)
- OKLCH
- oklch(0.464 0.08 191.3)
- OKLab
- oklab(0.464 -0.078 -0.016)
- CIE Lab
- lab(38.72 -26.81 -5.99)
- LCH
- lch(38.72 27.47 192.6)
- CMYK
- cmyk(100% 0% 3% 60%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 2C7572
- 478481
- 5F9390
- 75A29F
- 8CB1AE
- A3C0BE
- B9D0CE
- D0DFDE
- E8EFEE
Odcienie ciemniejsze
- 005956
- 004B48
- 003D3B
- 00302E
- 002322
- 001716
- 000C0B
- 000403
- 000000
Tony
- 1E6A67
- 2E6C6A
- 3B6F6C
- 47726F
- 517472
- 5B7775
- 657978
- 6E7B7A
- 777E7D
Harmonie kolorów
Komplementarna +180°
- 006764
Peacock Pride
- 7F454E
≈ Dark Strawberry
Analogowa -30° +30°
- 006764
Peacock Pride
- 28674B
≈ Brunswick
- 116379
≈ Blue Enchantment
Triada +120° +240°
- 006764
Peacock Pride
- 684C7A
≈ Benevolence
- 755121
≈ Trojan Horse Brown
Komplementarna rozszczepiona +150° +210°
- 006764
Peacock Pride
- 774766
≈ Scintillating Violet
- 7F4935
≈ Tortoise Shell
Tetrada +90° +180° +270°
- 006764
Peacock Pride
- 525385
≈ Baby Whale
- 7F454E
≈ Dark Strawberry
- 635A1F
≈ High Forest Green
Kontrast i dostępność
Ag
AANa bieli
WCAG 6.72:1 · APCA Lc 83
Ag
FailNa czerni
WCAG 3.12:1 · APCA Lc 19
Najlepszy kolor tekstu: #FFFFFF
WCAG 6.72:1 (AA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--peacock-pride: #006764;
--peacock-pride-rgb: 0 103 100;
--peacock-pride-oklch: oklch(0.464 0.08 191.3);
}
.element {
color: var(--peacock-pride);
background-color: hsl(178 100% 20%);
border-color: oklch(0.464 0.08 191.3);
}Tailwind CSS v4
@theme {
--color-peacock-pride: #006764;
--color-peacock-pride-50: #dcfdfb;
--color-peacock-pride-100: #caf1ef;
--color-peacock-pride-200: #ade0de;
--color-peacock-pride-300: #86c5c3;
--color-peacock-pride-400: #62aeaa;
--color-peacock-pride-500: #389793;
--color-peacock-pride-600: #32807c;
--color-peacock-pride-700: #276664;
--color-peacock-pride-800: #1b4b48;
--color-peacock-pride-900: #123432;
--color-peacock-pride-950: #04201e;
}SCSS
$peacock-pride: #006764;
$peacock-pride-rgb: 0, 103, 100;
$peacock-pride-light: mix(#fff, $peacock-pride, 20%);
$peacock-pride-dark: mix(#000, $peacock-pride, 20%);
.element {
color: $peacock-pride;
box-shadow: 0 0 0 2px rgba($peacock-pride, 0.35);
}