Created at 12/27/2017 21:23
Brown palette Materialize CSS
- brown lighten-5#efebe9
- brown lighten-4#d7ccc8
- brown lighten-3#bcaaa4
- brown lighten-2#a1887f
- brown lighten-1#8d6e63
- brown#795548
- brown darken-1#6d4c41
- brown darken-2#5d4037
- brown darken-3#4e342e
- brown darken-4#3e2723
The palette consists of Light, Semi dark, Dark colors. Accent colors brown darken-3 #4e342e and brown darken-4 #3e2723. Palette has Neutral, Warm colors temperature.
By lightness, this palette runs from #3E2723 (darkest) to #EFEBE9 (lightest). The lightness range is wide.
Overall saturation feels mostly muted (lower chroma) — 100% of colors are muted.
Hue spacing suggests a mostly analogous cluster spanning about 11° (loose heuristic, not a strict color-theory label).
Overall temperature among swatches leans warm (7 of 10).
HEX codes (sorted): #3E2723, #4E342E, #5D4037, #6D4C41, #795548, #8D6E63, #A1887F, #BCAAA4, #D7CCC8, #EFEBE9
Palette Brown palette Materialize CSS combines 10 color codes:
HEX: #efebe9, RGB: (239, 235, 233); HEX: #d7ccc8, RGB: (215, 204, 200); HEX: #bcaaa4, RGB: (188, 170, 164)
HEX: #a1887f, RGB: (161, 136, 127); HEX: #8d6e63, RGB: (141, 110, 99); HEX: #795548, RGB: (121, 85, 72)
HEX: #6d4c41, RGB: (109, 76, 65); HEX: #5d4037, RGB: (93, 64, 55); HEX: #4e342e, RGB: (78, 52, 46)
HEX: #3e2723, RGB: (62, 39, 35)
Simplified version of palette colors
Shade of whitesmoke, Shade of lightgrey, Tint of darkgrey, Shade of rosybrown, Tint of sienna, Shade of sienna, Tint of saddlebrown, Shade of saddlebrown, Tint of Maroon, Tint of Black
Color scheme was created by mz
Colors codes in palette
Brown palette Materialize CSS color codes HEX, RGB information in table
| Color | HEX | RGB | Name | Alternative name |
|---|---|---|---|---|
| #efebe9 | #efebe9 | RGB(239, 235, 233) | brown lighten-5 | — |
| #d7ccc8 | #d7ccc8 | RGB(215, 204, 200) | brown lighten-4 | — |
| #bcaaa4 | #bcaaa4 | RGB(188, 170, 164) | brown lighten-3 | — |
| #a1887f | #a1887f | RGB(161, 136, 127) | brown lighten-2 | — |
| #8d6e63 | #8d6e63 | RGB(141, 110, 99) | brown lighten-1 | — |
| #795548 | #795548 | RGB(121, 85, 72) | brown | — |
| #6d4c41 | #6d4c41 | RGB(109, 76, 65) | brown darken-1 | — |
| #5d4037 | #5d4037 | RGB(93, 64, 55) | brown darken-2 | — |
| #4e342e | #4e342e | RGB(78, 52, 46) | brown darken-3 | — |
| #3e2723 | #3e2723 | RGB(62, 39, 35) | brown darken-4 | — |
Color Palette Contrast
17 color pairs have low contrast and need improvement which may impact readability.
| Text Color | Background Color | Contrast Ratio |
|---|---|---|
#efebe9 | #d7ccc8 | 1.32 |
#efebe9 | #bcaaa4 | 1.88 |
#d7ccc8 | #bcaaa4 | 1.41 |
#bcaaa4 | #a1887f | 1.48 |
#a1887f | #8d6e63 | 1.39 |
#a1887f | #795548 | 1.97 |
Image palette Brown palette Materialize CSS png
Export Palette
Download the "Brown palette Materialize CSS" in multiple formats for seamless integration into your design projects.
Available formats: