Cor nomeada · #64CDBE
Kinetic Teal
Kinetic Teal é #64CDBE: rgb(100 205 190), hsl(171 51% 60%), oklch(0.782 0.1 183.1). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Kinetic Teal color name →
#64CDBE
oklch(0.782 0.1 183.1)
Conversões de cor
- HEX
- #64cdbe
- RGB
- rgb(100 205 190)
- HSL
- hsl(171 51% 60%)
- HWB
- hwb(171 39% 20%)
- OKLCH
- oklch(0.782 0.1 183.1)
- OKLab
- oklab(0.782 -0.1 -0.006)
- CIE Lab
- lab(75.9 -34.63 -2.34)
- LCH
- lch(75.9 34.71 183.9)
- CMYK
- cmyk(51% 0% 7% 20%)
Tons claros · Sombras · Tons
Tons claros
- 77D2C4
- 88D7CB
- 98DCD1
- A8E1D8
- B7E6DE
- C6EBE5
- D4F0EB
- E3F5F2
- F1FAF8
Sombras
- 56B2A5
- 48988C
- 3B7E75
- 2E665E
- 224E48
- 163833
- 0B231F
- 030F0D
- 000202
Tons
- 6AC5B8
- 6FBDB1
- 73B6AB
- 76AEA5
- 79A69E
- 7B9F98
- 7D9792
- 7E8F8C
- 7F8886
Harmonias de cor
Complementar +180°
- 64CDBE
Kinetic Teal
- EE9DB1
≈ Carnal Pink
Análoga -30° +30°
- 64CDBE
Kinetic Teal
- 84CB9A
≈ Good Luck Charm
- 61C9DE
≈ Squeaky
Tríade +120° +240°
- 64CDBE
Kinetic Teal
- C5A8ED
≈ Tropical Violet
- E6AA73
≈ Ninjin Orange
Complementar dividida +150° +210°
- 64CDBE
Kinetic Teal
- DFA0D3
≈ Exotic Violet
- F1A08E
≈ Blush
Tétrade +90° +180° +270°
- 64CDBE
Kinetic Teal
- A3B4F9
≈ Wondrous Wisteria
- EE9DB1
≈ Carnal Pink
- CEB76A
≈ Trumpet
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.90:1 · APCA Lc 36
Ag
AAASobre preto
WCAG 11.01:1 · APCA Lc 66
Melhor cor de texto: #000000
WCAG 11.01:1 (AAA) · APCA Lc 66
Contrast pairs
Trechos de código
CSS
:root {
--kinetic-teal: #64cdbe;
--kinetic-teal-rgb: 100 205 190;
--kinetic-teal-oklch: oklch(0.782 0.1 183.1);
}
.element {
color: var(--kinetic-teal);
background-color: hsl(171 51% 60%);
border-color: oklch(0.782 0.1 183.1);
}Tailwind CSS v4
@theme {
--color-kinetic-teal: #64cdbe;
--color-kinetic-teal-50: #d6fff9;
--color-kinetic-teal-100: #c3f3ec;
--color-kinetic-teal-200: #a3e3da;
--color-kinetic-teal-300: #79c8be;
--color-kinetic-teal-400: #4eb2a4;
--color-kinetic-teal-500: #009b8d;
--color-kinetic-teal-600: #0d8377;
--color-kinetic-teal-700: #0d695f;
--color-kinetic-teal-800: #084d44;
--color-kinetic-teal-900: #06362f;
--color-kinetic-teal-950: #00211c;
}SCSS
$kinetic-teal: #64cdbe;
$kinetic-teal-rgb: 100, 205, 190;
$kinetic-teal-light: mix(#fff, $kinetic-teal, 20%);
$kinetic-teal-dark: mix(#000, $kinetic-teal, 20%);
.element {
color: $kinetic-teal;
box-shadow: 0 0 0 2px rgba($kinetic-teal, 0.35);
}