Difference between revisions of "Branding"

From edegan.com
Jump to navigation Jump to search
(Removed redirect to McNair Center Branding)
Tag: Removed redirect
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
==Palette==
 
==Palette==
  
 
+
{| class="wikitable" style="vertical-align:bottom;"
 +
|- style="font-weight:bold;"
 +
! Color Name
 +
! Dark Blue
 +
! Light Blue
 +
! Dark Grey
 +
! Light Grey
 +
! Gold
 +
! Orange
 +
|-
 +
| style="font-weight:bold;" | Color
 +
| style="background-color:#00234F;" |
 +
| style="background-color:#2E7BB1;" |
 +
| style="background-color:#818283;" |
 +
| style="background-color:#DDDEDF;" |
 +
| style="background-color:#F3AB0D;" |
 +
| style="background-color:#DE7904;" |
 +
|-
 +
| style="font-weight:bold;" | Hex Code
 +
| #00234F
 +
| #2E7BB1
 +
| #818283
 +
| #DDDEDF
 +
| #F3AB27
 +
| #DE7904
 +
|-
 +
| style="font-weight:bold;" | RGB
 +
| 0,35,79
 +
| 46,123,177
 +
| 129,130,131
 +
| 221,222,223
 +
| 243,171,39
 +
| 222,121,4
 +
|}
  
 
===Inspiration===
 
===Inspiration===
Line 13: Line 46:
 
*Georgetown University is blue and grey: https://www.georgetown.edu/color-guide/
 
*Georgetown University is blue and grey: https://www.georgetown.edu/color-guide/
  
{| class="wikitable"  
+
{| class="wikitable sortable"  
|- style="vertical-align:bottom;"
+
|- style="font-weight:bold; vertical-align:bottom;"
 
! University
 
! University
 
! Dark Blue
 
! Dark Blue
Line 52: Line 85:
 
| #9D9D9D
 
| #9D9D9D
 
| #EBEEEE
 
| #EBEEEE
 +
| style="vertical-align:bottom;" |
 
| style="vertical-align:bottom;" | #EC7300
 
| style="vertical-align:bottom;" | #EC7300
| style="vertical-align:bottom;" | #D24000
 
 
|- style="vertical-align:bottom;"
 
|- style="vertical-align:bottom;"
 
| Rice
 
| Rice
Line 61: Line 94:
 
| #E0E2E6
 
| #E0E2E6
 
| #E9A139
 
| #E9A139
| #C04829
+
|  
 
|- style="vertical-align:bottom;"
 
|- style="vertical-align:bottom;"
 
| Georgetown
 
| Georgetown
Line 70: Line 103:
 
|  
 
|  
 
|  
 
|  
|- style="vertical-align:bottom;"
+
|- style="font-weight:bold; vertical-align:bottom;"
 
| Average
 
| Average
 
| #00234F
 
| #00234F
Line 76: Line 109:
 
| #818283
 
| #818283
 
| #DDDEDF
 
| #DDDEDF
| #F0981A
+
| #F3AB27
| #D04C0D
+
| #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

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:

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):

  • Book-open-fill.svg book-open
  • User-3-fill.svg user-3
  • Settings-5-fill.svg settings-5

See also

The McNair Center Branding used a variant on the Baker Institute's colors, which had obvious issues.