Benoemde kleur · #FFDDCC
Plastic Marble
Plastic Marble is #FFDDCC: rgb(255 221 204), hsl(20 100% 90%), oklch(0.921 0.044 48.2). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Plastic Marble color name →
#FFDDCC
oklch(0.921 0.044 48.2)
Kleurconversies
- HEX
- #ffddcc
- RGB
- rgb(255 221 204)
- HSL
- hsl(20 100% 90%)
- HWB
- hwb(20 80% 0%)
- OKLCH
- oklch(0.921 0.044 48.2)
- OKLab
- oklab(0.921 0.03 0.033)
- CIE Lab
- lab(90.66 10.25 12.95)
- LCH
- lch(90.66 16.51 51.6)
- CMYK
- cmyk(0% 13% 20% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFE0D1
- FFE4D6
- FFE7DB
- FFEBE0
- FFEEE5
- FFF1EB
- FFF5F0
- FFF8F5
- FFFCFA
Schaduwen
- DEC0B1
- BEA497
- 9E887E
- 806E65
- 63554E
- 483D37
- 2E2622
- 16110F
- 030202
Tonen
- F2D3C4
- E5CABC
- D7C0B5
- CBB7AD
- BEADA5
- B1A49E
- A59B96
- 98928F
- 8C8987
Kleurharmonieën
Complementair +180°
- FFDDCC
Plastic Marble
- C8ECFD
≈ Blue Java Banana
Analoog -30° +30°
- FFDDCC
Plastic Marble
- FFDBDB
≈ Cottagecore Sunset
- F6E2C5
≈ Barium
Triadisch +120° +240°
- FFDDCC
Plastic Marble
- CAEFDF
≈ Summer House
- E3E1FF
≈ Stoic White
Gesplitst complementair +150° +210°
- FFDDCC
Plastic Marble
- C4EFF0
≈ Icy Breeze
- D6E6FF
≈ Veiling Waterfalls
Tetradisch +90° +180° +270°
- FFDDCC
Plastic Marble
- D7EDD0
≈ Lantana Lime
- C8ECFD
≈ Blue Java Banana
- F2DCF9
≈ Lavender Savour
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.27:1 · APCA Lc 14
Ag
AAAOp zwart
WCAG 16.46:1 · APCA Lc 90
Beste tekstkleur: #000000
WCAG 16.46:1 (AAA) · APCA Lc 90
Contrast pairs
Codefragmenten
CSS
:root {
--plastic-marble: #ffddcc;
--plastic-marble-rgb: 255 221 204;
--plastic-marble-oklch: oklch(0.921 0.044 48.2);
}
.element {
color: var(--plastic-marble);
background-color: hsl(20 100% 90%);
border-color: oklch(0.921 0.044 48.2);
}Tailwind CSS v4
@theme {
--color-plastic-marble: #ffddcc;
--color-plastic-marble-50: #fff2ea;
--color-plastic-marble-100: #f5e4db;
--color-plastic-marble-200: #e5cfc4;
--color-plastic-marble-300: #cbb1a4;
--color-plastic-marble-400: #b59788;
--color-plastic-marble-500: #9f7e6d;
--color-plastic-marble-600: #876b5c;
--color-plastic-marble-700: #6c554a;
--color-plastic-marble-800: #503e36;
--color-plastic-marble-900: #382b24;
--color-plastic-marble-950: #221813;
}SCSS
$plastic-marble: #ffddcc;
$plastic-marble-rgb: 255, 221, 204;
$plastic-marble-light: mix(#fff, $plastic-marble, 20%);
$plastic-marble-dark: mix(#000, $plastic-marble, 20%);
.element {
color: $plastic-marble;
box-shadow: 0 0 0 2px rgba($plastic-marble, 0.35);
}