Colore con nome · #D9A05F
Butterscotch Syrup
Butterscotch Syrup è #D9A05F: rgb(217 160 95), hsl(32 62% 61%), oklch(0.746 0.107 68.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Butterscotch Syrup color name →
#D9A05F
oklch(0.746 0.107 68.6)
Conversioni di colore
- HEX
- #d9a05f
- RGB
- rgb(217 160 95)
- HSL
- hsl(32 62% 61%)
- HWB
- hwb(32 37% 15%)
- OKLCH
- oklch(0.746 0.107 68.6)
- OKLab
- oklab(0.746 0.039 0.099)
- CIE Lab
- lab(70.41 16.62 42.22)
- LCH
- lch(70.41 45.37 68.5)
- CMYK
- cmyk(0% 26% 56% 15%)
Tinte · Ombre · Toni
Tinte
- DDAA70
- E1B381
- E5BD91
- E9C6A1
- EDD0B0
- F1D9C0
- F5E3D0
- F8ECDF
- FCF6EF
Ombre
- BC8B52
- A17644
- 866138
- 6C4E2C
- 533B20
- 3B2915
- 25190A
- 110903
- 020100
Toni
- D09D64
- C79A68
- BE976C
- B59470
- AC9173
- A38D76
- 9B8A79
- 92877B
- 89837E
Armonie di colore
Complementare +180°
- D9A05F
Butterscotch Syrup
- 75B2ED
≈ Lucea
Analogo -30° +30°
- D9A05F
Butterscotch Syrup
- E7957A
≈ Dark Salmon Injustice
- BEAE5A
≈ Mack Creek
Triadico +120° +240°
- D9A05F
Butterscotch Syrup
- 4BC2BA
≈ Treasured Teal
- C09AE0
≈ Bright Lavender
Complementare divisa +150° +210°
- D9A05F
Butterscotch Syrup
- 50BDDA
≈ Azurean
- 9EA6F0
≈ Cold Lips
Tetradico +90° +180° +270°
- D9A05F
Butterscotch Syrup
- 6DC194
≈ Felt Green
- 75B2ED
≈ Lucea
- D992C4
≈ Firm Pink
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.29:1 · APCA Lc 45
Ag
AAASu nero
WCAG 9.14:1 · APCA Lc 57
Miglior colore del testo: #000000
WCAG 9.14:1 (AAA) · APCA Lc 57
Contrast pairs
Frammenti di codice
CSS
:root {
--butterscotch-syrup: #d9a05f;
--butterscotch-syrup-rgb: 217 160 95;
--butterscotch-syrup-oklch: oklch(0.746 0.107 68.6);
}
.element {
color: var(--butterscotch-syrup);
background-color: hsl(32 62% 61%);
border-color: oklch(0.746 0.107 68.6);
}Tailwind CSS v4
@theme {
--color-butterscotch-syrup: #d9a05f;
--color-butterscotch-syrup-50: #fff1d5;
--color-butterscotch-syrup-100: #ffe3c2;
--color-butterscotch-syrup-200: #f2cda3;
--color-butterscotch-syrup-300: #daae7a;
--color-butterscotch-syrup-400: #c89255;
--color-butterscotch-syrup-500: #b4772a;
--color-butterscotch-syrup-600: #986526;
--color-butterscotch-syrup-700: #7a511e;
--color-butterscotch-syrup-800: #5b3a15;
--color-butterscotch-syrup-900: #40280d;
--color-butterscotch-syrup-950: #281602;
}SCSS
$butterscotch-syrup: #d9a05f;
$butterscotch-syrup-rgb: 217, 160, 95;
$butterscotch-syrup-light: mix(#fff, $butterscotch-syrup, 20%);
$butterscotch-syrup-dark: mix(#000, $butterscotch-syrup, 20%);
.element {
color: $butterscotch-syrup;
box-shadow: 0 0 0 2px rgba($butterscotch-syrup, 0.35);
}