Colore con nome · #F3EFCD
Clotted Cream
Clotted Cream è #F3EFCD: rgb(243 239 205), hsl(54 61% 88%), oklch(0.947 0.045 101.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Clotted Cream color name →
#F3EFCD
oklch(0.947 0.045 101.7)
Conversioni di colore
- HEX
- #f3efcd
- RGB
- rgb(243 239 205)
- HSL
- hsl(54 61% 88%)
- HWB
- hwb(54 80% 5%)
- OKLCH
- oklch(0.947 0.045 101.7)
- OKLab
- oklab(0.947 -0.009 0.044)
- CIE Lab
- lab(94.11 -2.71 17.03)
- LCH
- lch(94.11 17.25 99)
- CMYK
- cmyk(0% 2% 16% 5%)
Tinte · Ombre · Toni
Tinte
- F4F1D2
- F5F2D7
- F7F4DC
- F8F5E1
- F9F7E6
- FAF9EB
- FBFAF0
- FDFCF5
- FEFDFA
Ombre
- D3D0B2
- B4B198
- 97947E
- 7A7866
- 5E5C4E
- 444238
- 2B2A23
- 14140F
- 030302
Toni
- E7E3C5
- DBD8BD
- CFCCB5
- C3C1AE
- B8B6A6
- ACAB9E
- A1A097
- 96958F
- 8B8B88
Armonie di colore
Complementare +180°
- F3EFCD
Clotted Cream
- EAECFF
≈ Brilliant White
Analogo -30° +30°
- F3EFCD
Clotted Cream
- FFEAD1
≈ Delightful Peach
- E3F4D5
≈ Light Green Glint
Triadico +120° +240°
- F3EFCD
Clotted Cream
- D4F4FF
≈ Water
- FFE5F4
≈ Bunny Tail
Complementare divisa +150° +210°
- F3EFCD
Clotted Cream
- E1EFFF
≈ Calcareous Sinter
- F5E7FF
≈ Soft Lavender
Tetradico +90° +180° +270°
- F3EFCD
Clotted Cream
- CCF8F5
≈ Tinted Ice
- EAECFF
≈ Brilliant White
- FFE6E8
≈ Vanilla Strawberry
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.16:1 · APCA Lc 8
Ag
AAASu nero
WCAG 18.03:1 · APCA Lc 97
Miglior colore del testo: #000000
WCAG 18.03:1 (AAA) · APCA Lc 97
Contrast pairs
Frammenti di codice
CSS
:root {
--clotted-cream: #f3efcd;
--clotted-cream-rgb: 243 239 205;
--clotted-cream-oklch: oklch(0.947 0.045 101.7);
}
.element {
color: var(--clotted-cream);
background-color: hsl(54 61% 88%);
border-color: oklch(0.947 0.045 101.7);
}Tailwind CSS v4
@theme {
--color-clotted-cream: #f3efcd;
--color-clotted-cream-50: #f7f6e8;
--color-clotted-cream-100: #eae9d8;
--color-clotted-cream-200: #d7d6c0;
--color-clotted-cream-300: #bbb99f;
--color-clotted-cream-400: #a3a082;
--color-clotted-cream-500: #8c8865;
--color-clotted-cream-600: #767356;
--color-clotted-cream-700: #5f5c45;
--color-clotted-cream-800: #464331;
--color-clotted-cream-900: #302e21;
--color-clotted-cream-950: #1d1b11;
}SCSS
$clotted-cream: #f3efcd;
$clotted-cream-rgb: 243, 239, 205;
$clotted-cream-light: mix(#fff, $clotted-cream, 20%);
$clotted-cream-dark: mix(#000, $clotted-cream, 20%);
.element {
color: $clotted-cream;
box-shadow: 0 0 0 2px rgba($clotted-cream, 0.35);
}