Nazwany kolor · #F5D9B1
Grappa
Grappa to #F5D9B1: rgb(245 217 177), hsl(35 77% 83%), oklch(0.899 0.061 76.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Grappa color name →
#F5D9B1
oklch(0.899 0.061 76.6)
Konwersje koloru
- HEX
- #f5d9b1
- RGB
- rgb(245 217 177)
- HSL
- hsl(35 77% 83%)
- HWB
- hwb(35 69% 4%)
- OKLCH
- oklch(0.899 0.061 76.6)
- OKLab
- oklab(0.899 0.014 0.059)
- CIE Lab
- lab(88.32 5.71 23.53)
- LCH
- lch(88.32 24.21 76.4)
- CMYK
- cmyk(0% 11% 28% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F6DDB9
- F7E1C1
- F8E4C9
- F9E8D0
- FAECD8
- FBF0E0
- FCF4E8
- FDF7EF
- FEFBF7
Odcienie ciemniejsze
- D5BC99
- B6A183
- 98866C
- 7B6C57
- 5F5342
- 443B2F
- 2B251C
- 15110C
- 030201
Tony
- E9D0AC
- DDC7A7
- D1BEA3
- C5B59E
- B9AC99
- ADA394
- A29A8F
- 96918A
- 8B8985
Harmonie kolorów
Komplementarna +180°
- F5D9B1
Grappa
- C9E0FF
≈ Arc Light
Analogowa -30° +30°
- F5D9B1
Grappa
- FFD3BE
≈ Vienna Sausage
- E2E1B2
≈ Schabziger Green
Triada +120° +240°
- F5D9B1
Grappa
- AEEBEB
≈ Spearmint Water
- EED2F9
≈ Rose Dragée
Komplementarna rozszczepiona +150° +210°
- F5D9B1
Grappa
- B3E7FD
≈ Frozen Landscape
- DAD9FF
≈ Transparent Blue
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.35:1 · APCA Lc 18
Ag
AAANa czerni
WCAG 15.44:1 · APCA Lc 86
Najlepszy kolor tekstu: #000000
WCAG 15.44:1 (AAA) · APCA Lc 86
Contrast pairs
Fragmenty kodu
CSS
:root {
--grappa: #f5d9b1;
--grappa-rgb: 245 217 177;
--grappa-oklch: oklch(0.899 0.061 76.6);
}
.element {
color: var(--grappa);
background-color: hsl(35 77% 83%);
border-color: oklch(0.899 0.061 76.6);
}Tailwind CSS v4
@theme {
--color-grappa: #f5d9b1;
--color-grappa-50: #fff4e2;
--color-grappa-100: #f3e6d2;
--color-grappa-200: #e3d2b8;
--color-grappa-300: #c9b495;
--color-grappa-400: #b39a76;
--color-grappa-500: #9d8158;
--color-grappa-600: #856d4b;
--color-grappa-700: #6b573b;
--color-grappa-800: #4f3f2a;
--color-grappa-900: #372c1c;
--color-grappa-950: #22190d;
}SCSS
$grappa: #f5d9b1;
$grappa-rgb: 245, 217, 177;
$grappa-light: mix(#fff, $grappa, 20%);
$grappa-dark: mix(#000, $grappa, 20%);
.element {
color: $grappa;
box-shadow: 0 0 0 2px rgba($grappa, 0.35);
}