Nazwany kolor · #F1BD89
Apricot Cream
Apricot Cream to #F1BD89: rgb(241 189 137), hsl(30 79% 74%), oklch(0.833 0.09 66.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Apricot Cream color name →
#F1BD89
oklch(0.833 0.09 66.1)
Konwersje koloru
- HEX
- #f1bd89
- RGB
- rgb(241 189 137)
- HSL
- hsl(30 79% 74%)
- HWB
- hwb(30 54% 5%)
- OKLCH
- oklch(0.833 0.09 66.1)
- OKLab
- oklab(0.833 0.037 0.082)
- CIE Lab
- lab(80.5 14.53 33.81)
- LCH
- lch(80.5 36.8 66.7)
- CMYK
- cmyk(0% 22% 43% 5%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F3C495
- F4CAA1
- F6D1AD
- F8D8B9
- F9DEC5
- FAE5D0
- FCEBDC
- FDF2E8
- FEF8F3
Odcienie ciemniejsze
- D2A476
- B38C64
- 957453
- 795D42
- 5D4731
- 433322
- 2B1F14
- 140D07
- 030201
Tony
- E5B789
- DAB188
- CEAB88
- C3A587
- B89E86
- AC9885
- A19284
- 968C83
- 8B8681
Harmonie kolorów
Komplementarna +180°
- F1BD89
Apricot Cream
- 98CFFF
≈ Long Island Sound
Analogowa -30° +30°
- F1BD89
Apricot Cream
- FDB4A0
≈ Just Blush
- DAC984
≈ Sandwisp
Triada +120° +240°
- F1BD89
Apricot Cream
- 7FDCD1
≈ Shimmering Blue
- D7BAF7
≈ Pink Illusion
Komplementarna rozszczepiona +150° +210°
- F1BD89
Apricot Cream
- 80D7EE
≈ Medium Sky Blue
- B9C4FF
≈ Light Periwinkle
Tetrada +90° +180° +270°
- F1BD89
Apricot Cream
- 98DAB0
≈ Peaceful Pastures
- 98CFFF
≈ Long Island Sound
- EEB2DF
≈ Soft Cashmere
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.69:1 · APCA Lc 30
Ag
AAANa czerni
WCAG 12.38:1 · APCA Lc 73
Najlepszy kolor tekstu: #000000
WCAG 12.38:1 (AAA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--apricot-cream: #f1bd89;
--apricot-cream-rgb: 241 189 137;
--apricot-cream-oklch: oklch(0.833 0.09 66.1);
}
.element {
color: var(--apricot-cream);
background-color: hsl(30 79% 74%);
border-color: oklch(0.833 0.09 66.1);
}Tailwind CSS v4
@theme {
--color-apricot-cream: #f1bd89;
--color-apricot-cream-50: #fff1da;
--color-apricot-cream-100: #fde3c8;
--color-apricot-cream-200: #efceac;
--color-apricot-cream-300: #d7af86;
--color-apricot-cream-400: #c39464;
--color-apricot-cream-500: #af7940;
--color-apricot-cream-600: #946737;
--color-apricot-cream-700: #76522c;
--color-apricot-cream-800: #583b1f;
--color-apricot-cream-900: #3e2914;
--color-apricot-cream-950: #271606;
}SCSS
$apricot-cream: #f1bd89;
$apricot-cream-rgb: 241, 189, 137;
$apricot-cream-light: mix(#fff, $apricot-cream, 20%);
$apricot-cream-dark: mix(#000, $apricot-cream, 20%);
.element {
color: $apricot-cream;
box-shadow: 0 0 0 2px rgba($apricot-cream, 0.35);
}