-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbranding.html
78 lines (62 loc) · 2.32 KB
/
branding.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/branding.css">
<link rel="stylesheet" href="css/fonting.css">
</head>
<body>
<div class="middle-content">
<!--Wordmark at top-->
<img id="wordmark" src="assets/images/branding/wordmark_600x58.png">
<!--Title-->
<h1 class="center-title gray-txt">Brand Guideline</h1>
<!--Color palette-->
<h2>Color Palette</h2>
<div class="area-line-grid">
<div class="area-line">
</div>
</div>
<!--Two primary colors-->
<div class="two-colors">
<div class="color-box red-color-box">
#dd2a2a
</div>
<div class="color-box gold-color-box">
#dda22c
</div>
</div>
<!--Three secondary colors-->
<div class="three-colors">
<div class="color-box white-color-box">
#f5f5f5
</div>
<div class="color-box gray-color-box white-txt">
#525252
</div>
<div class="color-box black-color-box white-txt">
#040f16
</div>
</div>
<!--The logos and wordmarks-->
<h2 id="brand-assets-title">Brand Assets</h2>
<div class="area-line-grid">
<div class="area-line">
</div>
</div>
<div class="half-and-half-grid">
<!--Wordmark title-->
<asset-title class="wordmark-title">Wordmark</asset-title>
<!--Wordmark Example-->
<div class="wordmark-example-div">
<img class="wordmark-example" src="assets/images/branding/wordmark_gray_600x58.png">
</div>
<!--Logo title-->
<asset-title class="logo-title logo-title">Logo</asset-title>
<!--Logo example-->
<div class="logo-example-div">
<img class="logo-example" src="assets/images/branding/square_red_600x600.jpg">
</div>
</div>
</div>
</body>
</html>