Nazwany kolor · #F3E2C3
Cameo Cream
Cameo Cream to #F3E2C3: rgb(243 226 195), hsl(39 67% 86%), oklch(0.919 0.045 82.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Cameo Cream color name →
#F3E2C3
oklch(0.919 0.045 82.6)
Konwersje koloru
- HEX
- #f3e2c3
- RGB
- rgb(243 226 195)
- HSL
- hsl(39 67% 86%)
- HWB
- hwb(39 76% 5%)
- OKLCH
- oklch(0.919 0.045 82.6)
- OKLab
- oklab(0.919 0.006 0.045)
- CIE Lab
- lab(90.68 2.42 17.43)
- LCH
- lch(90.68 17.59 82.1)
- CMYK
- cmyk(0% 7% 20% 5%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F4E5C9
- F5E8CF
- F7EBD5
- F8EEDB
- F9F1E1
- FAF3E7
- FBF6ED
- FDF9F3
- FEFCF9
Odcienie ciemniejsze
- D3C4A9
- B4A890
- 978C78
- 7A7160
- 5E574A
- 443E34
- 2B2720
- 14120E
- 030302
Tony
- E7D8BC
- DBCEB5
- CFC4AF
- C3BAA8
- B8B0A1
- ACA69A
- A19C94
- 96938D
- 8B8987
Harmonie kolorów
Komplementarna +180°
- F3E2C3
Cameo Cream
- D6E5FF
≈ Veiling Waterfalls
Analogowa -30° +30°
- F3E2C3
Cameo Cream
- FDDDC9
≈ Beach Trail
- E4E8C6
≈ More Mint
Triada +120° +240°
- F3E2C3
Cameo Cream
- C2EEF1
≈ Icy Breeze
- F3DBF6
≈ Grape Taffy
Komplementarna rozszczepiona +150° +210°
- F3E2C3
Cameo Cream
- C7EAFE
≈ Blue Java Banana
- E4DFFF
≈ Stoic White
Tetrada +90° +180° +270°
- F3E2C3
Cameo Cream
- C7EEE1
≈ Summer House
- D6E5FF
≈ Veiling Waterfalls
- FDD8E7
≈ Pig Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.27:1 · APCA Lc 14
Ag
AAANa czerni
WCAG 16.47:1 · APCA Lc 90
Najlepszy kolor tekstu: #000000
WCAG 16.47:1 (AAA) · APCA Lc 90
Contrast pairs
Fragmenty kodu
CSS
:root {
--cameo-cream: #f3e2c3;
--cameo-cream-rgb: 243 226 195;
--cameo-cream-oklch: oklch(0.919 0.045 82.6);
}
.element {
color: var(--cameo-cream);
background-color: hsl(39 67% 86%);
border-color: oklch(0.919 0.045 82.6);
}Tailwind CSS v4
@theme {
--color-cameo-cream: #f3e2c3;
--color-cameo-cream-50: #fbf4e7;
--color-cameo-cream-100: #efe7d7;
--color-cameo-cream-200: #ddd3bf;
--color-cameo-cream-300: #c2b69e;
--color-cameo-cream-400: #ac9c81;
--color-cameo-cream-500: #958464;
--color-cameo-cream-600: #7e7055;
--color-cameo-cream-700: #655944;
--color-cameo-cream-800: #4b4131;
--color-cameo-cream-900: #342d21;
--color-cameo-cream-950: #1f1a10;
}SCSS
$cameo-cream: #f3e2c3;
$cameo-cream-rgb: 243, 226, 195;
$cameo-cream-light: mix(#fff, $cameo-cream, 20%);
$cameo-cream-dark: mix(#000, $cameo-cream, 20%);
.element {
color: $cameo-cream;
box-shadow: 0 0 0 2px rgba($cameo-cream, 0.35);
}