Nazwany kolor · #ADC6D3
Twinkle
Twinkle to #ADC6D3: rgb(173 198 211), hsl(201 30% 75%), oklch(0.812 0.033 230.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Twinkle color name →
#ADC6D3
oklch(0.812 0.033 230.4)
Konwersje koloru
- HEX
- #adc6d3
- RGB
- rgb(173 198 211)
- HSL
- hsl(201 30% 75%)
- HWB
- hwb(201 68% 17%)
- OKLCH
- oklch(0.812 0.033 230.4)
- OKLab
- oklab(0.812 -0.021 -0.025)
- CIE Lab
- lab(78.3 -6.7 -9.52)
- LCH
- lch(78.3 11.64 234.9)
- CMYK
- cmyk(18% 6% 0% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B5CCD7
- BDD1DC
- C5D7E0
- CDDDE5
- D6E2E9
- DEE8ED
- E6EEF2
- EEF3F6
- F7F9FB
Odcienie ciemniejsze
- 96ACB7
- 7F929C
- 6A7A82
- 556269
- 414B51
- 2D353A
- 1B2124
- 0B0E10
- 010202
Tony
- A8BFCA
- A4B8C2
- 9FB0B9
- 9BA9B1
- 96A2A9
- 929BA0
- 8D9498
- 898E90
- 848788
Harmonie kolorów
Komplementarna +180°
- ADC6D3
Twinkle
- D4BCAF
≈ Wafer
Analogowa -30° +30°
- ADC6D3
Twinkle
- AAC8CA
≈ Spring Storm
- B6C2D7
≈ Virginia Blue
Triada +120° +240°
- ADC6D3
Twinkle
- D3B9C4
≈ Lavender Blessing
- C2C4AC
≈ Understory
Komplementarna rozszczepiona +150° +210°
- ADC6D3
Twinkle
- D6BAB9
≈ Bombay Pink
- CDC0AA
≈ Cabo
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.78:1 · APCA Lc 33
Ag
AAANa czerni
WCAG 11.79:1 · APCA Lc 70
Najlepszy kolor tekstu: #000000
WCAG 11.79:1 (AAA) · APCA Lc 70
Contrast pairs
Fragmenty kodu
CSS
:root {
--twinkle: #adc6d3;
--twinkle-rgb: 173 198 211;
--twinkle-oklch: oklch(0.812 0.033 230.4);
}
.element {
color: var(--twinkle);
background-color: hsl(201 30% 75%);
border-color: oklch(0.812 0.033 230.4);
}Tailwind CSS v4
@theme {
--color-twinkle: #adc6d3;
--color-twinkle-50: #ecf7fd;
--color-twinkle-100: #deeaf1;
--color-twinkle-200: #c7d7e0;
--color-twinkle-300: #a8bbc6;
--color-twinkle-400: #8ca2ae;
--color-twinkle-500: #718b98;
--color-twinkle-600: #5f7581;
--color-twinkle-700: #4c5e67;
--color-twinkle-800: #37454b;
--color-twinkle-900: #253034;
--color-twinkle-950: #141c20;
}SCSS
$twinkle: #adc6d3;
$twinkle-rgb: 173, 198, 211;
$twinkle-light: mix(#fff, $twinkle, 20%);
$twinkle-dark: mix(#000, $twinkle, 20%);
.element {
color: $twinkle;
box-shadow: 0 0 0 2px rgba($twinkle, 0.35);
}