Adlandırılmış renk · #F7F2D7
Breezy Beige
Breezy Beige, #F7F2D7: rgb(247 242 215), hsl(51 67% 91%), oklch(0.958 0.036 98.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Breezy Beige color name →
#F7F2D7
oklch(0.958 0.036 98.4)
Renk dönüşümleri
- HEX
- #f7f2d7
- RGB
- rgb(247 242 215)
- HSL
- hsl(51 67% 91%)
- HWB
- hwb(51 84% 3%)
- OKLCH
- oklch(0.958 0.036 98.4)
- OKLab
- oklab(0.958 -0.005 0.035)
- CIE Lab
- lab(95.36 -1.56 13.72)
- LCH
- lch(95.36 13.81 96.5)
- CMYK
- cmyk(0% 2% 13% 3%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F8F3DB
- F9F5DF
- F9F6E3
- FAF7E7
- FBF9EB
- FCFAEF
- FDFBF3
- FDFCF7
- FEFEFB
Koyu tonlar
- D7D2BB
- B7B49F
- 999685
- 7C796B
- 605E52
- 45433B
- 2C2B25
- 151411
- 030302
Gri tonlar
- EAE6CE
- DEDAC5
- D2CEBC
- C6C3B3
- BAB7AB
- AEACA2
- A2A199
- 979691
- 8B8B88
Renk uyumları
Tamamlayıcı +180°
- F7F2D7
Breezy Beige
- EEF0FF
≈ Carte Blanche
Analog -30° +30°
- F7F2D7
Breezy Beige
- FFEEDC
≈ Enokitake Mushroom
- EAF6DD
≈ Minified Lime
Üçlü +120° +240°
- F7F2D7
Breezy Beige
- DCF7FF
≈ Glacial Day
- FFEAF8
≈ Strawberry Bonbon
Bölünmüş tamamlayıcı +150° +210°
- F7F2D7
Breezy Beige
- E7F3FF
≈ Moon White
- F6EDFF
≈ Placebo Fuchsia
Dörtlü +90° +180° +270°
- F7F2D7
Breezy Beige
- D7F9F6
≈ Fishious Rend
- EEF0FF
≈ Carte Blanche
- FFECEE
≈ Translucent Unicorn
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.12:1 · APCA Lc 0
Ag
AAASiyah üzerinde
WCAG 18.63:1 · APCA Lc 99
En iyi metin rengi: #000000
WCAG 18.63:1 (AAA) · APCA Lc 99
Contrast pairs
Kod parçacıkları
CSS
:root {
--breezy-beige: #f7f2d7;
--breezy-beige-rgb: 247 242 215;
--breezy-beige-oklch: oklch(0.958 0.036 98.4);
}
.element {
color: var(--breezy-beige);
background-color: hsl(51 67% 91%);
border-color: oklch(0.958 0.036 98.4);
}Tailwind CSS v4
@theme {
--color-breezy-beige: #f7f2d7;
--color-breezy-beige-50: #f7f6ea;
--color-breezy-beige-100: #eae8db;
--color-breezy-beige-200: #d7d5c4;
--color-breezy-beige-300: #bbb8a4;
--color-breezy-beige-400: #a49f87;
--color-breezy-beige-500: #8c876c;
--color-breezy-beige-600: #76725c;
--color-breezy-beige-700: #5f5b49;
--color-breezy-beige-800: #464335;
--color-breezy-beige-900: #302e24;
--color-breezy-beige-950: #1d1b13;
}SCSS
$breezy-beige: #f7f2d7;
$breezy-beige-rgb: 247, 242, 215;
$breezy-beige-light: mix(#fff, $breezy-beige, 20%);
$breezy-beige-dark: mix(#000, $breezy-beige, 20%);
.element {
color: $breezy-beige;
box-shadow: 0 0 0 2px rgba($breezy-beige, 0.35);
}