Color
Color plays a big part in bringing a brand together. Here is the palette of the base scheme, right next to each other. If you can't feel a brand impression or at least get a hint at a mood, it might be worthwhile to revisit the scheme.
- #4074a0
- #96701d
- #73a040
- #6d40a0
Often the brand palette is used more subtly, via the light versions of the brand shades. These washed-out or pastel tones should also work together to give you a hint of the brand:
- #74c2ff
- #ffc227
- #b7ff61
Here are all the brand colors, broken out in logical groupings.
| Palette | Value | Name | Description | Category |
|---|---|---|---|---|
| | #000 | black | Black or near-black, typically used for body text against a white background. | Monochrome |
| | #555 | grey-dark | Monochrome | |
| | #999 | grey | Monochrome | |
| | #eee | grey-light | Monochrome | |
| | #fff | white | Monochrome | |
| | #4074a0 | main | Theme | |
| | #1d3141 | main-dark | Theme | |
| | #74c2ff | main-light | Theme | |
| | #96701d | second | Theme | |
| | #41201c | second-dark | Theme | |
| | #ffc227 | second-light | Theme | |
| | #73a040 | third | Theme | |
| | #204120 | third-dark | Theme | |
| | #b7ff61 | third-light | Theme | |
| | #6d40a0 | accent | Theme | |
| | #004085 | status | UI | |
| | #cce5ff | status-background | UI | |
| | #856404 | warning | UI | |
| | #fff3cd | warning-background | UI | |
| | #721c24 | error | UI | |
| | #f8d7da | error-background | UI |