Nazwany kolor · #F8CC9C
Apricot Ice Cream
Apricot Ice Cream to #F8CC9C: rgb(248 204 156), hsl(31 87% 79%), oklch(0.872 0.08 68.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Apricot Ice Cream color name →
#F8CC9C
oklch(0.872 0.08 68.9)
Konwersje koloru
- HEX
- #f8cc9c
- RGB
- rgb(248 204 156)
- HSL
- hsl(31 87% 79%)
- HWB
- hwb(31 61% 3%)
- OKLCH
- oklch(0.872 0.08 68.9)
- OKLab
- oklab(0.872 0.029 0.074)
- CIE Lab
- lab(85.09 11.36 30.12)
- LCH
- lch(85.09 32.19 69.3)
- CMYK
- cmyk(0% 18% 37% 3%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F9D1A6
- FAD6B0
- FBDBBA
- FBE1C4
- FCE6CE
- FDEBD8
- FDF0E2
- FEF5EB
- FFFAF5
Odcienie ciemniejsze
- D8B187
- B89773
- 9A7E5F
- 7C654C
- 604E39
- 453728
- 2C2218
- 150F09
- 030201
Tony
- ECC49A
- DFBD97
- D3B594
- C7AD92
- BBA68F
- AF9E8C
- A39689
- 978F86
- 8C8783
Harmonie kolorów
Komplementarna +180°
- F8CC9C
Apricot Ice Cream
- B4D9FF
≈ Oh Boy!
Analogowa -30° +30°
- F8CC9C
Apricot Ice Cream
- FFC6B3
≈ Ballet Skirt
- E2D699
≈ Lifeless Planet
Triada +120° +240°
- F8CC9C
Apricot Ice Cream
- 95E6DF
≈ Sharbah Fizz
- E4C7FE
≈ Wisteria Powder
Komplementarna rozszczepiona +150° +210°
- F8CC9C
Apricot Ice Cream
- 98E2F9
≈ Ganon Blue
- CBD1FF
≈ Pale Phthalo Blue
Tetrada +90° +180° +270°
- F8CC9C
Apricot Ice Cream
- A8E6C2
≈ Tropical
- B4D9FF
≈ Oh Boy!
- F9C1E7
≈ Pretty in Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.48:1 · APCA Lc 23
Ag
AAANa czerni
WCAG 14.10:1 · APCA Lc 80
Najlepszy kolor tekstu: #000000
WCAG 14.10:1 (AAA) · APCA Lc 80
Contrast pairs
Fragmenty kodu
CSS
:root {
--apricot-ice-cream: #f8cc9c;
--apricot-ice-cream-rgb: 248 204 156;
--apricot-ice-cream-oklch: oklch(0.872 0.08 68.9);
}
.element {
color: var(--apricot-ice-cream);
background-color: hsl(31 87% 79%);
border-color: oklch(0.872 0.08 68.9);
}Tailwind CSS v4
@theme {
--color-apricot-ice-cream: #f8cc9c;
--color-apricot-ice-cream-50: #fff2dd;
--color-apricot-ice-cream-100: #f9e4cc;
--color-apricot-ice-cream-200: #ebcfb0;
--color-apricot-ice-cream-300: #d2b18b;
--color-apricot-ice-cream-400: #be966a;
--color-apricot-ice-cream-500: #a97c49;
--color-apricot-ice-cream-600: #8f693e;
--color-apricot-ice-cream-700: #725432;
--color-apricot-ice-cream-800: #553d23;
--color-apricot-ice-cream-900: #3b2a17;
--color-apricot-ice-cream-950: #251708;
}SCSS
$apricot-ice-cream: #f8cc9c;
$apricot-ice-cream-rgb: 248, 204, 156;
$apricot-ice-cream-light: mix(#fff, $apricot-ice-cream, 20%);
$apricot-ice-cream-dark: mix(#000, $apricot-ice-cream, 20%);
.element {
color: $apricot-ice-cream;
box-shadow: 0 0 0 2px rgba($apricot-ice-cream, 0.35);
}