Nazwany kolor · #2DDFC1
Celestial Green
Celestial Green to #2DDFC1: rgb(45 223 193), hsl(170 74% 53%), oklch(0.812 0.142 177.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Celestial Green color name →
#2DDFC1
oklch(0.812 0.142 177.7)
Konwersje koloru
- HEX
- #2ddfc1
- RGB
- rgb(45 223 193)
- HSL
- hsl(170 74% 53%)
- HWB
- hwb(170 18% 13%)
- OKLCH
- oklch(0.812 0.142 177.7)
- OKLab
- oklab(0.812 -0.142 0.006)
- CIE Lab
- lab(80.02 -49.91 1.81)
- LCH
- lch(80.02 49.94 177.9)
- CMYK
- cmyk(80% 0% 13% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 55E3C7
- 70E6CD
- 86EAD3
- 9AEDD9
- ADF0E0
- BEF3E6
- CFF6EC
- E0F9F2
- EFFCF9
Odcienie ciemniejsze
- 26C2A7
- 1FA58F
- 188A77
- 116F5F
- 0B5649
- 063D34
- 022720
- 01120E
- 000202
Tony
- 44D5BA
- 53CCB4
- 5EC2AD
- 67B9A6
- 6EAFA0
- 73A699
- 789C93
- 7B938D
- 7E8986
Harmonie kolorów
Komplementarna +180°
- 2DDFC1
Celestial Green
- FFA1C2
≈ Taffy Pink
Analogowa -30° +30°
- 2DDFC1
Celestial Green
- 7DDA8C
≈ Aurora Green
- 00DAF0
≈ Tamarama
Triada +120° +240°
- 2DDFC1
Celestial Green
- C9B3FF
≈ Teasel Dipsacus
- FFAC6B
≈ Transparent Orange
Komplementarna rozszczepiona +150° +210°
- 2DDFC1
Celestial Green
- F39FF0
≈ Diva Mecha
- FFA79C
≈ Corally
Tetrada +90° +180° +270°
- 2DDFC1
Celestial Green
- A7C0FF
≈ Pastel Blue
- FFA1C2
≈ Taffy Pink
- E8BB44
≈ Capital Yellow
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.68:1 · APCA Lc 29
Ag
AAANa czerni
WCAG 12.43:1 · APCA Lc 73
Najlepszy kolor tekstu: #000000
WCAG 12.43:1 (AAA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--celestial-green: #2ddfc1;
--celestial-green-rgb: 45 223 193;
--celestial-green-oklch: oklch(0.812 0.142 177.7);
}
.element {
color: var(--celestial-green);
background-color: hsl(170 74% 53%);
border-color: oklch(0.812 0.142 177.7);
}Tailwind CSS v4
@theme {
--color-celestial-green: #2ddfc1;
--color-celestial-green-50: #cafff6;
--color-celestial-green-100: #b4f8e9;
--color-celestial-green-200: #8de9d6;
--color-celestial-green-300: #55cfba;
--color-celestial-green-400: #00b99e;
--color-celestial-green-500: #00a386;
--color-celestial-green-600: #008a71;
--color-celestial-green-700: #006e5a;
--color-celestial-green-800: #005140;
--color-celestial-green-900: #00392c;
--color-celestial-green-950: #002319;
}SCSS
$celestial-green: #2ddfc1;
$celestial-green-rgb: 45, 223, 193;
$celestial-green-light: mix(#fff, $celestial-green, 20%);
$celestial-green-dark: mix(#000, $celestial-green, 20%);
.element {
color: $celestial-green;
box-shadow: 0 0 0 2px rgba($celestial-green, 0.35);
}