Adlandırılmış renk · #6AB9BB
Fresh Soft Blue
Fresh Soft Blue, #6AB9BB: rgb(106 185 187), hsl(181 37% 57%), oklch(0.736 0.078 197.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Fresh Soft Blue color name →
#6AB9BB
oklch(0.736 0.078 197.7)
Renk dönüşümleri
- HEX
- #6ab9bb
- RGB
- rgb(106 185 187)
- HSL
- hsl(181 37% 57%)
- HWB
- hwb(181 42% 27%)
- OKLCH
- oklch(0.736 0.078 197.7)
- OKLab
- oklab(0.736 -0.074 -0.024)
- CIE Lab
- lab(70.18 -24.99 -9.05)
- LCH
- lch(70.18 26.58 199.9)
- CMYK
- cmyk(43% 1% 0% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 7AC0C2
- 8AC7C8
- 99CECF
- A8D5D6
- B7DCDD
- C5E3E3
- D4EAEA
- E2F1F1
- F1F8F8
Koyu tonlar
- 5BA0A2
- 4D898A
- 3F7173
- 315B5C
- 244646
- 183132
- 0D1E1F
- 040D0D
- 000202
Gri tonlar
- 6EB3B5
- 71AEAF
- 74A8A9
- 77A2A3
- 799C9D
- 7B9797
- 7D9191
- 7E8B8C
- 7F8686
Renk uyumları
Tamamlayıcı +180°
- 6AB9BB
Fresh Soft Blue
- D69697
≈ Blooming Perfect
Analog -30° +30°
- 6AB9BB
Fresh Soft Blue
- 77BAA0
≈ Arboretum
- 73B4D0
≈ Madonna Blue
Üçlü +120° +240°
- 6AB9BB
Fresh Soft Blue
- BE9ACA
≈ Lilac Pink
- C5A471
≈ Mustard Seed Beige
Bölünmüş tamamlayıcı +150° +210°
- 6AB9BB
Fresh Soft Blue
- CF96B2
≈ Exotic Lilac
- D39B7F
≈ Dusty Coral
Dörtlü +90° +180° +270°
- 6AB9BB
Fresh Soft Blue
- A6A2D9
≈ Simply Violet
- D69697
≈ Blooming Perfect
- AEAE73
≈ Wasabi Green
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.26:1 · APCA Lc 45
Ag
AAASiyah üzerinde
WCAG 9.26:1 · APCA Lc 58
En iyi metin rengi: #000000
WCAG 9.26:1 (AAA) · APCA Lc 58
Contrast pairs
Kod parçacıkları
CSS
:root {
--fresh-soft-blue: #6ab9bb;
--fresh-soft-blue-rgb: 106 185 187;
--fresh-soft-blue-oklch: oklch(0.736 0.078 197.7);
}
.element {
color: var(--fresh-soft-blue);
background-color: hsl(181 37% 57%);
border-color: oklch(0.736 0.078 197.7);
}Tailwind CSS v4
@theme {
--color-fresh-soft-blue: #6ab9bb;
--color-fresh-soft-blue-50: #dcfcfe;
--color-fresh-soft-blue-100: #cbf0f2;
--color-fresh-soft-blue-200: #aedfe1;
--color-fresh-soft-blue-300: #87c4c7;
--color-fresh-soft-blue-400: #63adaf;
--color-fresh-soft-blue-500: #3a9698;
--color-fresh-soft-blue-600: #337f81;
--color-fresh-soft-blue-700: #286667;
--color-fresh-soft-blue-800: #1c4b4b;
--color-fresh-soft-blue-900: #123434;
--color-fresh-soft-blue-950: #041f1f;
}SCSS
$fresh-soft-blue: #6ab9bb;
$fresh-soft-blue-rgb: 106, 185, 187;
$fresh-soft-blue-light: mix(#fff, $fresh-soft-blue, 20%);
$fresh-soft-blue-dark: mix(#000, $fresh-soft-blue, 20%);
.element {
color: $fresh-soft-blue;
box-shadow: 0 0 0 2px rgba($fresh-soft-blue, 0.35);
}