Adlandırılmış renk · #F2B8CA
Berries N’ Cream
Berries N’ Cream, #F2B8CA: rgb(242 184 202), hsl(341 69% 84%), oklch(0.84 0.071 358.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Pink mean? → · Berries N’ Cream color name →
#F2B8CA
oklch(0.84 0.071 358.3)
Renk dönüşümleri
- HEX
- #f2b8ca
- RGB
- rgb(242 184 202)
- HSL
- hsl(341 69% 84%)
- HWB
- hwb(341 72% 5%)
- OKLCH
- oklch(0.84 0.071 358.3)
- OKLab
- oklab(0.84 0.071 -0.002)
- CIE Lab
- lab(80.57 23.56 -0.53)
- LCH
- lch(80.57 23.57 358.7)
- CMYK
- cmyk(0% 24% 17% 5%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F4BFCF
- F5C6D4
- F7CDDA
- F8D4DF
- FADBE4
- FBE3EA
- FCEAEF
- FDF1F4
- FEF8FA
Koyu tonlar
- D2A0AF
- B48895
- 96717C
- 795B64
- 5E454D
- 433137
- 2B1E22
- 140C0F
- 030202
Gri tonlar
- E6B2C2
- DBADBB
- CFA7B3
- C4A1AC
- B89CA4
- AD969D
- A29196
- 968B8E
- 8B8687
Renk uyumları
Tamamlayıcı +180°
- F2B8CA
Berries N’ Cream
- 98DACB
≈ Tropical Freeze
Analog -30° +30°
- F2B8CA
Berries N’ Cream
- E5BBE2
≈ Blackberry Yoghurt
- F5BAB1
≈ Ballerina Tears
Üçlü +120° +240°
- F2B8CA
Berries N’ Cream
- C6D29D
≈ Cricket Field
- A0D2F4
≈ Juzcar Blue
Bölünmüş tamamlayıcı +150° +210°
- F2B8CA
Berries N’ Cream
- ACD8B1
≈ Frugal
- 93D8E3
≈ Quiet Pond
Dörtlü +90° +180° +270°
- F2B8CA
Berries N’ Cream
- DEC996
≈ Nomadic Travels
- 98DACB
≈ Tropical Freeze
- B7CAFA
≈ Night Snow
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.68:1 · APCA Lc 30
Ag
AAASiyah üzerinde
WCAG 12.48:1 · APCA Lc 73
En iyi metin rengi: #000000
WCAG 12.48:1 (AAA) · APCA Lc 73
Contrast pairs
Kod parçacıkları
CSS
:root {
--berries-n-cream: #f2b8ca;
--berries-n-cream-rgb: 242 184 202;
--berries-n-cream-oklch: oklch(0.84 0.071 358.3);
}
.element {
color: var(--berries-n-cream);
background-color: hsl(341 69% 84%);
border-color: oklch(0.84 0.071 358.3);
}Tailwind CSS v4
@theme {
--color-berries-n-cream: #f2b8ca;
--color-berries-n-cream-50: #ffedf4;
--color-berries-n-cream-100: #fddfe7;
--color-berries-n-cream-200: #efc8d3;
--color-berries-n-cream-300: #d7a9b6;
--color-berries-n-cream-400: #c28d9e;
--color-berries-n-cream-500: #ad7286;
--color-berries-n-cream-600: #926171;
--color-berries-n-cream-700: #754d5a;
--color-berries-n-cream-800: #563843;
--color-berries-n-cream-900: #3c262e;
--color-berries-n-cream-950: #26151b;
}SCSS
$berries-n-cream: #f2b8ca;
$berries-n-cream-rgb: 242, 184, 202;
$berries-n-cream-light: mix(#fff, $berries-n-cream, 20%);
$berries-n-cream-dark: mix(#000, $berries-n-cream, 20%);
.element {
color: $berries-n-cream;
box-shadow: 0 0 0 2px rgba($berries-n-cream, 0.35);
}