Brand Theme Colors
Primary Colors
#152395
#07147E
#FF9C20
#EF4F00
Accent Colors
#F9F9FB
#8492A6
#456385
#79B700
UI Colors
The main UI colors are used for action buttons, alert messages, and form elements. Input fields, for example, can get positive and negative feedback, whereas alert messages can have warning feedback.
#0676EC
#43CC84
#FF9E00
#FF0038
Branding Typography
Aa
Open Sans
Bold
Aa
Open Sans
300
Aa
Josefin Sans
Bold
Aa
Josefin Sans
500
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.
Brand Logo Guide
The Basics
The XPX Logo is a powerful symbol that stands as the primary visual representations of our brand. Our Logo acts as our signature and is the common thread among all our Chapters, events, as well as all forms of communication. Consistency is essential across all media, as we want it to be instantly recognizable.
Download the Logo
Using The XPX Logo
The XPX Logo is a powerful symbol that stands as the primary visual representations of our brand. Our Logo acts as our signature and is the common thread among all our Chapters, events, as well as all forms of communication. Consistency is essential across all media, as we want it to be instantly recognizable.
Safe Space
The XPX Logo always needs safe space that is free of imagery and text surrounding it. Use half the first X’s width to determine the minimum amount of safe space that should surround the Logo.
This width can be used to determine the amount of safe space around the top and bottom of the logo as well.
Misuse & What Not To Do
It is important that the appearance of the logo remains consistent. The logo should never be altered, modified, misinterpreted, or added to. You should not alter the logo in which it effects the orientation, color, or composition, other than what is indicated in this documentation.
DON'T
- Change the spacing between the letters in the characters “XPX”
- Use any colors other than approved Brand Colors
- Choose a different typeface for “XPX”
- Add visual effects like a drop shadow
- Change or replace the letters “XPX” in any way
- Change the shape of the Logo
- Visually use the Logo in a phrase or sentence
Brand Layout
Open Sans, 20pt size, bold & 300 font weight, 1 letter spacing, 1.3 lining. Left align.
Lorem Ipsum
Open Sans, 60pt size, bold font weight, 1 letter spacing, 1.3 lining. Left align.
Lorem Ipsum
Open Sans, 15pt size, 500 font weight, 1 letter spacing, 2 lining. Justify align.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.
Brand Button Colors
#000000
#B47D41
#8492A6
#97A5AD
Primary Colors
The main UI colors are used for action buttons, alert messages, and form elements. Input fields, for example, can get positive and negative feedback, whereas alert messages can have warning feedback.
Brand Iconography Colors
#152395
#FF9C20
#00C99C
#F12699
#15B2EC
#793AFA
#FF5E00
Primary Colors
The main UI colors are used for action buttons, alert messages, and form elements. Input fields, for example, can get positive and negative feedback, whereas alert messages can have warning feedback.