Adlandırılmış renk · #60A0A3
Meadowbrook
Meadowbrook, #60A0A3: rgb(96 160 163), hsl(183 27% 51%), oklch(0.664 0.066 199.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Meadowbrook color name →
#60A0A3
oklch(0.664 0.066 199.5)
Renk dönüşümleri
- HEX
- #60a0a3
- RGB
- rgb(96 160 163)
- HSL
- hsl(183 27% 51%)
- HWB
- hwb(183 38% 36%)
- OKLCH
- oklch(0.664 0.066 199.5)
- OKLab
- oklab(0.664 -0.062 -0.022)
- CIE Lab
- lab(61.67 -20.82 -8.4)
- LCH
- lch(61.67 22.45 202)
- CMYK
- cmyk(41% 2% 0% 36%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 71A9AC
- 81B3B5
- 91BCBE
- A0C5C7
- B0CFD0
- C0D8D9
- CFE2E3
- DFECEC
- EFF5F6
Koyu tonlar
- 528B8D
- 457678
- 386163
- 2C4E4F
- 203B3C
- 15292A
- 0A1919
- 03090A
- 000101
Gri tonlar
- 649D9F
- 699A9C
- 6C9798
- 709395
- 739091
- 768D8E
- 798A8A
- 7B8787
- 7E8383
Renk uyumları
Tamamlayıcı +180°
- 60A0A3
Meadowbrook
- B98383
≈ Bashful Rose
Analog -30° +30°
- 60A0A3
Meadowbrook
- 6AA18D
≈ Jade Dragon
- 689BB4
≈ Yacht Blue
Üçlü +120° +240°
- 60A0A3
Meadowbrook
- A687AD
≈ Violet Eclipse
- A98F65
≈ Fossil Butte
Bölünmüş tamamlayıcı +150° +210°
- 60A0A3
Meadowbrook
- B38399
≈ Heather Violet
- B5886F
≈ Red Gravel
Dörtlü +90° +180° +270°
- 60A0A3
Meadowbrook
- 928DBA
≈ Sweet Lavender
- B98383
≈ Bashful Rose
- 969768
≈ Guacamole
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.97:1 · APCA Lc 56
Ag
AAASiyah üzerinde
WCAG 7.05:1 · APCA Lc 46
En iyi metin rengi: #000000
WCAG 7.05:1 (AAA) · APCA Lc 46
Contrast pairs
Kod parçacıkları
CSS
:root {
--meadowbrook: #60a0a3;
--meadowbrook-rgb: 96 160 163;
--meadowbrook-oklch: oklch(0.664 0.066 199.5);
}
.element {
color: var(--meadowbrook);
background-color: hsl(183 27% 51%);
border-color: oklch(0.664 0.066 199.5);
}Tailwind CSS v4
@theme {
--color-meadowbrook: #60a0a3;
--color-meadowbrook-50: #e0fbfd;
--color-meadowbrook-100: #d0eff1;
--color-meadowbrook-200: #b4dde0;
--color-meadowbrook-300: #90c2c5;
--color-meadowbrook-400: #6eabad;
--color-meadowbrook-500: #4b9497;
--color-meadowbrook-600: #417d80;
--color-meadowbrook-700: #346466;
--color-meadowbrook-800: #24494a;
--color-meadowbrook-900: #183334;
--color-meadowbrook-950: #081f1f;
}SCSS
$meadowbrook: #60a0a3;
$meadowbrook-rgb: 96, 160, 163;
$meadowbrook-light: mix(#fff, $meadowbrook, 20%);
$meadowbrook-dark: mix(#000, $meadowbrook, 20%);
.element {
color: $meadowbrook;
box-shadow: 0 0 0 2px rgba($meadowbrook, 0.35);
}