Nazwany kolor · #EBAF95
Sweet Marmalade
Sweet Marmalade to #EBAF95: rgb(235 175 149), hsl(18 68% 75%), oklch(0.803 0.079 44.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Sweet Marmalade color name →
#EBAF95
oklch(0.803 0.079 44.5)
Konwersje koloru
- HEX
- #ebaf95
- RGB
- rgb(235 175 149)
- HSL
- hsl(18 68% 75%)
- HWB
- hwb(18 58% 8%)
- OKLCH
- oklch(0.803 0.079 44.5)
- OKLab
- oklab(0.803 0.057 0.056)
- CIE Lab
- lab(76.7 20.14 22.39)
- LCH
- lch(76.7 30.11 48)
- CMYK
- cmyk(0% 26% 37% 8%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EDB79F
- F0BFAA
- F2C7B4
- F4CFBF
- F6D7CA
- F8DFD4
- FAE7DF
- FCEFE9
- FEF7F4
Odcienie ciemniejsze
- CC9881
- AE816D
- 916B5A
- 755648
- 5B4137
- 412E26
- 291C16
- 130B08
- 030101
Tony
- E0AA93
- D5A691
- CAA18F
- C09C8D
- B5988B
- AA9389
- A08E87
- 958A85
- 8B8582
Harmonie kolorów
Komplementarna +180°
- EBAF95
Sweet Marmalade
- 85CAE5
≈ Budgie Blue
Analogowa -30° +30°
- EBAF95
Sweet Marmalade
- EDAAAF
≈ Hibiscus Petal
- DDB885
≈ Burlywood
Triada +120° +240°
- EBAF95
Sweet Marmalade
- 8ECFB2
≈ Vile Green
- B8B8F1
≈ Purple Illusion
Komplementarna rozszczepiona +150° +210°
- EBAF95
Sweet Marmalade
- 7FCFCE
≈ Aqua Splash
- 9CC2F2
≈ Sail to the Sea
Tetrada +90° +180° +270°
- EBAF95
Sweet Marmalade
- AACB97
≈ Oh Pistachio
- 85CAE5
≈ Budgie Blue
- D2B0E3
≈ Whisper of Plum
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.89:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.09:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.09:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--sweet-marmalade: #ebaf95;
--sweet-marmalade-rgb: 235 175 149;
--sweet-marmalade-oklch: oklch(0.803 0.079 44.5);
}
.element {
color: var(--sweet-marmalade);
background-color: hsl(18 68% 75%);
border-color: oklch(0.803 0.079 44.5);
}Tailwind CSS v4
@theme {
--color-sweet-marmalade: #ebaf95;
--color-sweet-marmalade-50: #ffefe2;
--color-sweet-marmalade-100: #ffe0d2;
--color-sweet-marmalade-200: #f2cbb8;
--color-sweet-marmalade-300: #dbac95;
--color-sweet-marmalade-400: #c79078;
--color-sweet-marmalade-500: #b2755a;
--color-sweet-marmalade-600: #97634c;
--color-sweet-marmalade-700: #794f3d;
--color-sweet-marmalade-800: #5a392c;
--color-sweet-marmalade-900: #3f271e;
--color-sweet-marmalade-950: #28150e;
}SCSS
$sweet-marmalade: #ebaf95;
$sweet-marmalade-rgb: 235, 175, 149;
$sweet-marmalade-light: mix(#fff, $sweet-marmalade, 20%);
$sweet-marmalade-dark: mix(#000, $sweet-marmalade, 20%);
.element {
color: $sweet-marmalade;
box-shadow: 0 0 0 2px rgba($sweet-marmalade, 0.35);
}