Colore con nome · #017371
Reef
Reef è #017371: rgb(1 115 113), hsl(179 98% 23%), oklch(0.502 0.086 192.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Reef color name →
#017371
oklch(0.502 0.086 192.6)
Conversioni di colore
- HEX
- #017371
- RGB
- rgb(1 115 113)
- HSL
- hsl(179 98% 23%)
- HWB
- hwb(179 0% 55%)
- OKLCH
- oklch(0.502 0.086 192.6)
- OKLab
- oklab(0.502 -0.084 -0.019)
- CIE Lab
- lab(43.21 -28.59 -7.19)
- LCH
- lch(43.21 29.48 194.1)
- CMYK
- cmyk(99% 0% 2% 55%)
Tinte · Ombre · Toni
Tinte
- 30807E
- 4B8E8C
- 629C99
- 79A9A7
- 8FB7B5
- A6C5C4
- BCD4D2
- D2E2E1
- E8F0F0
Ombre
- 016361
- 015452
- 004543
- 003635
- 002827
- 001B1A
- 000F0E
- 000504
- 000101
Toni
- 217573
- 327674
- 3F7776
- 4A7977
- 547A79
- 5E7B7A
- 677D7C
- 6F7E7D
- 787F7F
Armonie di colore
Complementare +180°
- 017371
Reef
- 8E4E56
≈ Rialto
Analogo -30° +30°
- 017371
Reef
- 2D7355
≈ Green Velvet
- 186E87
≈ Private Eye
Triadico +120° +240°
- 017371
Reef
- 755587
≈ Ninja Princess
- 825B26
≈ Hot Curry
Complementare divisa +150° +210°
- 017371
Reef
- 864F71
≈ Purple Davenport
- 8D533B
≈ Annatto
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.68:1 · APCA Lc 78
Ag
FailSu nero
WCAG 3.69:1 · APCA Lc 24
Miglior colore del testo: #FFFFFF
WCAG 5.68:1 (AA) · APCA Lc 78
Contrast pairs
Frammenti di codice
CSS
:root {
--reef: #017371;
--reef-rgb: 1 115 113;
--reef-oklch: oklch(0.502 0.086 192.6);
}
.element {
color: var(--reef);
background-color: hsl(179 98% 23%);
border-color: oklch(0.502 0.086 192.6);
}Tailwind CSS v4
@theme {
--color-reef: #017371;
--color-reef-50: #dafdfd;
--color-reef-100: #c8f1f0;
--color-reef-200: #aae0df;
--color-reef-300: #82c6c5;
--color-reef-400: #5bafac;
--color-reef-500: #2c9895;
--color-reef-600: #28817e;
--color-reef-700: #206765;
--color-reef-800: #154c49;
--color-reef-900: #0e3533;
--color-reef-950: #01201e;
}SCSS
$reef: #017371;
$reef-rgb: 1, 115, 113;
$reef-light: mix(#fff, $reef, 20%);
$reef-dark: mix(#000, $reef, 20%);
.element {
color: $reef;
box-shadow: 0 0 0 2px rgba($reef, 0.35);
}