Component library interface style guide widgets hex colors
- Safety Orange (Blaze Orange)#f26a08
- Middle Yellow Red#f1ac6c
- Tenné (Tawny)#d35c05
- Liver Chestnut#9c6c54
- Cadet Blue (Crayola)#b0acbc
- Dark Lava#4c3c34
Created at 10/14/2022 08:52
The palette consists of Light, Semi dark colors. Accent colors Tenné (Tawny) #d35c05 and Cadet Blue (Crayola) #b0acbc. Palette has Warm, Neutral colors temperature.
By lightness, this palette runs from #4C3C34 (darkest) to #F1AC6C (lightest). The lightness range is moderate.
Saturation is mixed — 2 muted and 3 vivid out of 6 colors.
An analogous palette: its hues sit close together on the color wheel, within about 9°.
Overall temperature among swatches leans warm (5 of 6).
HEX codes (sorted): #4C3C34, #9C6C54, #B0ACBC, #D35C05, #F1AC6C, #F26A08
Palette Component library interface style guide widgets hex colors combines 6 color codes:
HEX: #f26a08, RGB: (242, 106, 8); HEX: #f1ac6c, RGB: (241, 172, 108); HEX: #d35c05, RGB: (211, 92, 5)
HEX: #9c6c54, RGB: (156, 108, 84); HEX: #b0acbc, RGB: (176, 172, 188); HEX: #4c3c34, RGB: (76, 60, 52)
Simplified version of palette colors
Tint of Chocolate, Tint of Sandy Brown, Shade of Chocolate, Tint of Sienna, Tint of Dark Gray, Shade of Dim Gray
Color scheme was created by colorswall
Color codes in palette
Component library interface style guide widgets hex colors color codes HEX, RGB information in table
| Color | HEX | RGB | Name | Alternative name |
|---|---|---|---|---|
| #f26a08 | #f26a08 | RGB(242, 106, 8) | Safety Orange (Blaze Orange) | — |
| #f1ac6c | #f1ac6c | RGB(241, 172, 108) | Middle Yellow Red | — |
| #d35c05 | #d35c05 | RGB(211, 92, 5) | Tenné (Tawny) | — |
| #9c6c54 | #9c6c54 | RGB(156, 108, 84) | Liver Chestnut | — |
| #b0acbc | #b0acbc | RGB(176, 172, 188) | Cadet Blue (Crayola) | — |
| #4c3c34 | #4c3c34 | RGB(76, 60, 52) | Dark Lava | — |
Color Palette Contrast
7 color pairs have low contrast and need improvement which may impact readability.
| Text Color | Background Color | Contrast Ratio |
|---|---|---|
#f26a08 | #f1ac6c | 1.58 |
#f26a08 | #d35c05 | 1.28 |
#f26a08 | #9c6c54 | 1.45 |
#f26a08 | #b0acbc | 1.38 |
#f1ac6c | #b0acbc | 1.14 |
#d35c05 | #9c6c54 | 1.13 |
Image palette Component library interface style guide widgets hex colors png
Export Palette
Download the "Component library interface style guide widgets hex colors" in multiple formats for seamless integration into your design projects.
Available formats: