En yakın adlandırılmış renk · #F3CCCA
#F3CCCA
En yakın adlandırılmış renk: Happy Piglets
#F3CCCA (rgb(243 204 202), hsl(3 63% 87%), oklch(0.878 0.044 21.5)) en çok Happy Piglets adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#F3CCCA
oklch(0.878 0.044 21.5)
Renk dönüşümleri
- HEX
- #f3ccca
- RGB
- rgb(243 204 202)
- HSL
- hsl(3 63% 87%)
- HWB
- hwb(3 79% 5%)
- OKLCH
- oklch(0.878 0.044 21.5)
- OKLab
- oklab(0.878 0.041 0.016)
- CIE Lab
- lab(85.41 13.95 6.4)
- LCH
- lch(85.41 15.35 24.7)
- CMYK
- cmyk(0% 16% 17% 5%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F4D1CF
- F6D6D4
- F7DBDA
- F8E0DF
- FAE5E4
- FBEBEA
- FCF0EF
- FDF5F4
- FEFAFA
Koyu tonlar
- D3B1AF
- B49795
- 977E7C
- 7A6564
- 5E4E4D
- 443737
- 2B2222
- 140F0F
- 030202
Gri tonlar
- E7C4C2
- DBBCBB
- CFB5B3
- C4ADAC
- B8A5A4
- AD9E9D
- A19696
- 968F8E
- 8B8787
Renk uyumları
Tamamlayıcı +180°
- F3CCCA
Happy Piglets
- B6E0E3
≈ Fine Blue
Analog -30° +30°
- F3CCCA
Happy Piglets
- EFCBDA
≈ Persian Delight
- F0CFBD
≈ Desert Mesa
Üçlü +120° +240°
- F3CCCA
Happy Piglets
- C7DFC4
≈ Shanghai Silk
- C7D8F5
≈ Fly a Kite
Bölünmüş tamamlayıcı +150° +210°
- F3CCCA
Happy Piglets
- BBE1D3
≈ Pale Mountain Lake Turquoise
- BADDEF
≈ Ice Rink
Dörtlü +90° +180° +270°
- F3CCCA
Happy Piglets
- D7DAB9
≈ Apple Cucumber
- B6E0E3
≈ Fine Blue
- D6D2F3
≈ Air Castle
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.46:1 · APCA Lc 22
Ag
AAASiyah üzerinde
WCAG 14.30:1 · APCA Lc 81
En iyi metin rengi: #000000
WCAG 14.30:1 (AAA) · APCA Lc 81
Contrast pairs
Kod parçacıkları
CSS
:root {
--happy-piglets: #f3ccca;
--happy-piglets-rgb: 243 204 202;
--happy-piglets-oklch: oklch(0.878 0.044 21.5);
}
.element {
color: var(--happy-piglets);
background-color: hsl(3 63% 87%);
border-color: oklch(0.878 0.044 21.5);
}Tailwind CSS v4
@theme {
--color-happy-piglets: #f3ccca;
--color-happy-piglets-50: #fff1ef;
--color-happy-piglets-100: #f7e3e1;
--color-happy-piglets-200: #e7cdcb;
--color-happy-piglets-300: #cdafad;
--color-happy-piglets-400: #b79593;
--color-happy-piglets-500: #a27b79;
--color-happy-piglets-600: #896867;
--color-happy-piglets-700: #6e5352;
--color-happy-piglets-800: #513c3c;
--color-happy-piglets-900: #382929;
--color-happy-piglets-950: #231717;
}SCSS
$happy-piglets: #f3ccca;
$happy-piglets-rgb: 243, 204, 202;
$happy-piglets-light: mix(#fff, $happy-piglets, 20%);
$happy-piglets-dark: mix(#000, $happy-piglets, 20%);
.element {
color: $happy-piglets;
box-shadow: 0 0 0 2px rgba($happy-piglets, 0.35);
}