Color con nombre · #C48446
Butterscotch Glaze
Butterscotch Glaze es #C48446: rgb(196 132 70), hsl(30 52% 52%), oklch(0.666 0.111 62.9). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Butterscotch Glaze color name →
#C48446
oklch(0.666 0.111 62.9)
Conversiones de color
- HEX
- #c48446
- RGB
- rgb(196 132 70)
- HSL
- hsl(30 52% 52%)
- HWB
- hwb(30 27% 23%)
- OKLCH
- oklch(0.666 0.111 62.9)
- OKLab
- oklab(0.666 0.051 0.099)
- CIE Lab
- lab(60.95 20.96 43.23)
- LCH
- lch(60.95 48.04 64.1)
- CMYK
- cmyk(0% 33% 64% 23%)
Tintes · Sombras · Tonos
Tintes
- CA905A
- D19C6D
- D7A97F
- DDB592
- E3C1A4
- E9CDB6
- EFDAC8
- F4E6DA
- FAF3ED
Sombras
- AA723C
- 916032
- 784F28
- 613F1E
- 4A2F15
- 35200D
- 211205
- 0E0602
- 020100
Tonos
- BD844E
- B78455
- B0845C
- A98362
- A38367
- 9C836D
- 958272
- 8E8277
- 87817B
Armonías de color
Complementario +180°
- C48446
Butterscotch Glaze
- 519BD3
≈ Blue Iguana
Análogo -30° +30°
- C48446
Butterscotch Glaze
- CF7967
≈ Jaded Ginger
- AC923A
≈ Balsam Pear
Triádico +120° +240°
- C48446
Butterscotch Glaze
- 24AA9A
≈ Tropical Hideaway
- A283CC
≈ Lilac Purple
Complementario dividido +150° +210°
- C48446
Butterscotch Glaze
- 1EA5BD
≈ Maui
- 7E8FD8
≈ Mood Mode
Tetrádico +90° +180° +270°
- C48446
Butterscotch Glaze
- 59A873
≈ Aqua Forest
- 519BD3
≈ Blue Iguana
- BD7AB1
≈ Colombo Red Mauve
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 3.11:1 · APCA Lc 58
Ag
AASobre negro
WCAG 6.73:1 · APCA Lc 44
Mejor color de texto: #000000
WCAG 6.73:1 (AA) · APCA Lc 44
Contrast pairs
Fragmentos de código
CSS
:root {
--butterscotch-glaze: #c48446;
--butterscotch-glaze-rgb: 196 132 70;
--butterscotch-glaze-oklch: oklch(0.666 0.111 62.9);
}
.element {
color: var(--butterscotch-glaze);
background-color: hsl(30 52% 52%);
border-color: oklch(0.666 0.111 62.9);
}Tailwind CSS v4
@theme {
--color-butterscotch-glaze: #c48446;
--color-butterscotch-glaze-50: #ffefd5;
--color-butterscotch-glaze-100: #ffe1c2;
--color-butterscotch-glaze-200: #f6cba3;
--color-butterscotch-glaze-300: #dfac7a;
--color-butterscotch-glaze-400: #cd8f55;
--color-butterscotch-glaze-500: #b9742b;
--color-butterscotch-glaze-600: #9c6226;
--color-butterscotch-glaze-700: #7e4e1e;
--color-butterscotch-glaze-800: #5e3815;
--color-butterscotch-glaze-900: #42270d;
--color-butterscotch-glaze-950: #2a1502;
}SCSS
$butterscotch-glaze: #c48446;
$butterscotch-glaze-rgb: 196, 132, 70;
$butterscotch-glaze-light: mix(#fff, $butterscotch-glaze, 20%);
$butterscotch-glaze-dark: mix(#000, $butterscotch-glaze, 20%);
.element {
color: $butterscotch-glaze;
box-shadow: 0 0 0 2px rgba($butterscotch-glaze, 0.35);
}