Difference between revisions of "Branding"
Jump to navigation
Jump to search
(→Icons) |
|||
(6 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
==Palette== | ==Palette== | ||
− | |||
{| class="wikitable" style="vertical-align:bottom;" | {| class="wikitable" style="vertical-align:bottom;" | ||
Line 17: | Line 16: | ||
| style="background-color:#818283;" | | | style="background-color:#818283;" | | ||
| style="background-color:#DDDEDF;" | | | style="background-color:#DDDEDF;" | | ||
− | | style="background-color:# | + | | style="background-color:#F3AB0D;" | |
− | | style="background-color:# | + | | style="background-color:#DE7904;" | |
|- | |- | ||
| style="font-weight:bold;" | Hex Code | | style="font-weight:bold;" | Hex Code | ||
Line 25: | Line 24: | ||
| #818283 | | #818283 | ||
| #DDDEDF | | #DDDEDF | ||
− | | # | + | | #F3AB27 |
− | | # | + | | #DE7904 |
|- | |- | ||
| style="font-weight:bold;" | RGB | | style="font-weight:bold;" | RGB | ||
Line 33: | Line 32: | ||
| 129,130,131 | | 129,130,131 | ||
| 221,222,223 | | 221,222,223 | ||
− | | | + | | 243,171,39 |
− | | | + | | 222,121,4 |
|} | |} | ||
− | |||
===Inspiration=== | ===Inspiration=== | ||
Line 49: | Line 47: | ||
{| class="wikitable sortable" | {| class="wikitable sortable" | ||
− | |- style="vertical-align:bottom;" | + | |- style="font-weight:bold; vertical-align:bottom;" |
! University | ! University | ||
! Dark Blue | ! Dark Blue | ||
Line 87: | Line 85: | ||
| #9D9D9D | | #9D9D9D | ||
| #EBEEEE | | #EBEEEE | ||
+ | | style="vertical-align:bottom;" | | ||
| style="vertical-align:bottom;" | #EC7300 | | style="vertical-align:bottom;" | #EC7300 | ||
− | |||
|- style="vertical-align:bottom;" | |- style="vertical-align:bottom;" | ||
| Rice | | Rice | ||
Line 96: | Line 94: | ||
| #E0E2E6 | | #E0E2E6 | ||
| #E9A139 | | #E9A139 | ||
− | | | + | | |
|- style="vertical-align:bottom;" | |- style="vertical-align:bottom;" | ||
| Georgetown | | Georgetown | ||
Line 105: | Line 103: | ||
| | | | ||
| | | | ||
− | |- style="vertical-align:bottom;" | + | |- style="font-weight:bold; vertical-align:bottom;" |
− | | | + | | Average |
− | | | + | | #00234F |
− | | | + | | #2E7BB1 |
− | | | + | | #818283 |
− | | | + | | #DDDEDF |
− | | | + | | #F3AB27 |
− | | | + | | #DE7904 |
|} | |} | ||
Note that UBC has hex codes and RBG codes that don't match. I used the hex codes. A spreadsheet doing the math is in E:\projects\WebDesign\Colors.xlsx | Note that UBC has hex codes and RBG codes that don't match. I used the hex codes. A spreadsheet doing the math is in E:\projects\WebDesign\Colors.xlsx | ||
+ | |||
+ | ==Icons== | ||
+ | |||
+ | There are some very good icon repositories online. I used https://remixicon.com/, which provides icons under the Apache license. Specifically, I chose (show in 48px): | ||
+ | *[[File:Book-open-fill.svg]] book-open | ||
+ | *[[File:user-3-fill.svg]] user-3 | ||
+ | *[[File:Settings-5-fill.svg]] settings-5 | ||
==See also== | ==See also== | ||
The [[McNair Center Branding]] used a variant on the Baker Institute's colors, which had obvious issues. | The [[McNair Center Branding]] used a variant on the Baker Institute's colors, which had obvious issues. |
Latest revision as of 13:04, 18 September 2020
Contents
Palette
Color Name | Dark Blue | Light Blue | Dark Grey | Light Grey | Gold | Orange |
---|---|---|---|---|---|---|
Color | ||||||
Hex Code | #00234F | #2E7BB1 | #818283 | #DDDEDF | #F3AB27 | #DE7904 |
RGB | 0,35,79 | 46,123,177 | 129,130,131 | 221,222,223 | 243,171,39 | 222,121,4 |
Inspiration
The colors are inspired in part by my universities:
- UCL is orange and black: https://www.ucl.ac.uk/cam/brand/guidelines/colour
- UBC is blue and grey: https://brand.ubc.ca/guidelines/downloads/ubc-colour-and-fonts/
- U.C. Berkeley is blue and gold: https://brand.berkeley.edu/colors/
- Imperial College London is blue and grey: https://www.imperial.ac.uk/brand-style-guide/visual-identity/brand-colours/
- Rice University is blue and grey: https://brand.rice.edu/design-elements
- Georgetown University is blue and grey: https://www.georgetown.edu/color-guide/
University | Dark Blue | Light Blue | Dark Grey | Light Grey | Gold | Orange |
---|---|---|---|---|---|---|
UCL | #EA7600 | |||||
UBC | #002145 | #00A7E1 | ||||
Berkeley | #003262 | #3B7EA1 | #888888 | #EEEEEE | #FDB515 | #C4820E |
Imperial | #002147 | #003E74 | #9D9D9D | #EBEEEE | #EC7300 | |
Rice | #00205B | #ADC7DC | #7C7E7F | #E0E2E6 | #E9A139 | |
Georgetown | #041E42 | #003DA5 | #63666A | #BBBCBC | ||
Average | #00234F | #2E7BB1 | #818283 | #DDDEDF | #F3AB27 | #DE7904 |
Note that UBC has hex codes and RBG codes that don't match. I used the hex codes. A spreadsheet doing the math is in E:\projects\WebDesign\Colors.xlsx
Icons
There are some very good icon repositories online. I used https://remixicon.com/, which provides icons under the Apache license. Specifically, I chose (show in 48px):
See also
The McNair Center Branding used a variant on the Baker Institute's colors, which had obvious issues.