Adlandırılmış renk · #DF9689
Fresh Watermelon
Fresh Watermelon, #DF9689: rgb(223 150 137), hsl(9 57% 71%), oklch(0.742 0.091 30.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Fresh Watermelon color name →
#DF9689
oklch(0.742 0.091 30.5)
Renk dönüşümleri
- HEX
- #df9689
- RGB
- rgb(223 150 137)
- HSL
- hsl(9 57% 71%)
- HWB
- hwb(9 54% 13%)
- OKLCH
- oklch(0.742 0.091 30.5)
- OKLab
- oklab(0.742 0.078 0.046)
- CIE Lab
- lab(69.33 27.11 18.68)
- LCH
- lch(69.33 32.92 34.6)
- CMYK
- cmyk(0% 33% 39% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E3A094
- E7ABA0
- EAB5AC
- EEC0B7
- F1CAC3
- F4D5CF
- F7DFDB
- FAEAE7
- FDF4F3
Koyu tonlar
- C28276
- A56E64
- 8A5B53
- 6F4942
- 563731
- 3D2622
- 271614
- 120807
- 020101
Gri tonlar
- D69488
- CC9288
- C39087
- B98E86
- B08C85
- A68984
- 9D8783
- 938582
- 8A8281
Renk uyumları
Tamamlayıcı +180°
- DF9689
Fresh Watermelon
- 5FBBCC
≈ Delusional Dragonfly
Analog -30° +30°
- DF9689
Fresh Watermelon
- DC93A9
≈ Foxy Pink
- D69E70
≈ Caramelo Dulce
Üçlü +120° +240°
- DF9689
Fresh Watermelon
- 81BC8E
≈ Oilcloth Green
- 96A9E6
≈ Dalmatian Sage
Bölünmüş tamamlayıcı +150° +210°
- DF9689
Fresh Watermelon
- 64BFAE
≈ Blue Energy
- 75B3E0
≈ Xavier Blue
Dörtlü +90° +180° +270°
- DF9689
Fresh Watermelon
- A3B572
≈ Around the Gills
- 5FBBCC
≈ Delusional Dragonfly
- B59FDD
≈ Violet Velvet
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.36:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.86:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.86:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--fresh-watermelon: #df9689;
--fresh-watermelon-rgb: 223 150 137;
--fresh-watermelon-oklch: oklch(0.742 0.091 30.5);
}
.element {
color: var(--fresh-watermelon);
background-color: hsl(9 57% 71%);
border-color: oklch(0.742 0.091 30.5);
}Tailwind CSS v4
@theme {
--color-fresh-watermelon: #df9689;
--color-fresh-watermelon-50: #ffece5;
--color-fresh-watermelon-100: #ffded5;
--color-fresh-watermelon-200: #f9c7bc;
--color-fresh-watermelon-300: #e2a79a;
--color-fresh-watermelon-400: #cf8a7e;
--color-fresh-watermelon-500: #bb6e61;
--color-fresh-watermelon-600: #9e5e53;
--color-fresh-watermelon-700: #7f4b42;
--color-fresh-watermelon-800: #5e3630;
--color-fresh-watermelon-900: #422521;
--color-fresh-watermelon-950: #2a1310;
}SCSS
$fresh-watermelon: #df9689;
$fresh-watermelon-rgb: 223, 150, 137;
$fresh-watermelon-light: mix(#fff, $fresh-watermelon, 20%);
$fresh-watermelon-dark: mix(#000, $fresh-watermelon, 20%);
.element {
color: $fresh-watermelon;
box-shadow: 0 0 0 2px rgba($fresh-watermelon, 0.35);
}