Nazwany kolor · #22FFFF
Crisp Cyan
Crisp Cyan to #22FFFF: rgb(34 255 255), hsl(180 100% 57%), oklch(0.907 0.151 194.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Crisp Cyan color name →
#22FFFF
oklch(0.907 0.151 194.8)
Konwersje koloru
- HEX
- #22ffff
- RGB
- rgb(34 255 255)
- HSL
- hsl(180 100% 57%)
- HWB
- hwb(180 13% 0%)
- OKLCH
- oklch(0.907 0.151 194.8)
- OKLab
- oklab(0.907 -0.146 -0.039)
- CIE Lab
- lab(90.83 -49.56 -14.7)
- LCH
- lch(90.83 51.7 196.5)
- CMYK
- cmyk(87% 0% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 56FFFF
- 75FFFF
- 8CFFFF
- A1FFFF
- B3FFFF
- C4FFFF
- D4FFFF
- E3FFFF
- F1FFFF
Odcienie ciemniejsze
- 1CDEDE
- 16BEBE
- 119E9E
- 0B8080
- 076363
- 034848
- 012E2E
- 001616
- 000303
Tony
- 43F2F2
- 56E5E4
- 62D8D7
- 6BCBCA
- 72BEBE
- 78B2B1
- 7BA5A5
- 7E9998
- 7F8C8C
Harmonie kolorów
Komplementarna +180°
- 22FFFF
Crisp Cyan
- FFD4D6
≈ We Peep
Analogowa -30° +30°
- 22FFFF
Crisp Cyan
- 71FFC8
≈ Iridescent Turquoise
- B6EAFF
≈ Ice Effect
Triada +120° +240°
- 22FFFF
Crisp Cyan
- F1D4FF
≈ Rose Dragée
- FFDAA8
≈ Peachy Summer Skies
Komplementarna rozszczepiona +150° +210°
- 22FFFF
Crisp Cyan
- FFD1EA
≈ Pink Currant
- FFD6C5
≈ Tiny Pink
Tetrada +90° +180° +270°
- 22FFFF
Crisp Cyan
- DCDDFF
≈ Transparent Blue
- FFD4D6
≈ We Peep
- F0E662
≈ Celandine
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.24:1 · APCA Lc 12
Ag
AAANa czerni
WCAG 16.81:1 · APCA Lc 92
Najlepszy kolor tekstu: #000000
WCAG 16.81:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmenty kodu
CSS
:root {
--crisp-cyan: #22ffff;
--crisp-cyan-rgb: 34 255 255;
--crisp-cyan-oklch: oklch(0.907 0.151 194.8);
}
.element {
color: var(--crisp-cyan);
background-color: hsl(180 100% 57%);
border-color: oklch(0.907 0.151 194.8);
}Tailwind CSS v4
@theme {
--color-crisp-cyan: #22ffff;
--color-crisp-cyan-50: #c3ffff;
--color-crisp-cyan-100: #abf8f9;
--color-crisp-cyan-200: #7fe9ea;
--color-crisp-cyan-300: #38cfd2;
--color-crisp-cyan-400: #00b9ba;
--color-crisp-cyan-500: #00a2a5;
--color-crisp-cyan-600: #00898b;
--color-crisp-cyan-700: #006e70;
--color-crisp-cyan-800: #005150;
--color-crisp-cyan-900: #003938;
--color-crisp-cyan-950: #002323;
}SCSS
$crisp-cyan: #22ffff;
$crisp-cyan-rgb: 34, 255, 255;
$crisp-cyan-light: mix(#fff, $crisp-cyan, 20%);
$crisp-cyan-dark: mix(#000, $crisp-cyan, 20%);
.element {
color: $crisp-cyan;
box-shadow: 0 0 0 2px rgba($crisp-cyan, 0.35);
}