Brand Guidelines
Effective 12 May 2023
This Brand Guidelines policy outlines the general rules when you use the Trepup brand, including logo, color schemes, typography, and iconography, applicable to all media such as in-store signage, packaging, digital media, and broadcast.
The policy should be read in conjunction and together with the Terms of Service and the Policies. For the purposes of this policy, all capitalized terms, not otherwise defined herein, shall have the meaning ascribed to them as set forth in the Terms of Service and Brand Usage policy.
All references in this policy to the singular shall include the plural (and vice versa) where applicable, and any gender form shall include all others.
You may download and use Trepup Marks in accordance with this policy and the Brand Usage policy. We are happy to have you promote your Trepup presence and user content. Just make sure your ads and marketing materials do not suggest that Trepup is sponsoring your promotions or formally affiliated in any way.
Download our brand resources
Logo
Trepup's logo is strong, innovative, and impactful. It reflects our unique mission, robust security, easy processes, and user-centered design. To preserve the integrity of the logo when using it, always maintain sufficient clear space around it. The clear space around the logo is a critical part of its design and ensures that the logo can be seen and is uncluttered by any other logos, symbols, images, or text.
Our logo has two variants which are used on light or dark backgrounds. The background on which Trepup Marks are used must provide adequate contrast for the logo.
Blue logo on light background
White logo on dark background
While using our logo, you must not (1) stretch, crop or otherwise manipulate the logo, (2) type out the text in the logo in any other fonts, or (3) change the colors in the logo.
Don't
Do not stretch or manipulate the logo
Don't
Do not type out Trepup in any other fonts
Don't
Do not change the logo colors
Social icons
If you are looking to make it easier for people to connect with you on Trepup, we have made different social icons for you to choose from.
Logo Social Icon
Minimum width = 32px
Circular Social Icon
Minimum width = 32px
Square Social Icon
Minimum width = 32px
Rounded Square Social Icon
Minimum width = 32px
Color palette
Color is a critical part of Trepup's design and is used in a consistent and meaningful manner in all our communications. Our color palette, characteristic of the Trepup brand, gives it a unique look and feel.
Our primary brand colors are blue and white. They are used to provide accessibility, simplicity, and consistency throughout our brand communications.
Blue
HEX: 0066c1
RGB: 0 102 193
White
HEX: ffffff
RGB: 255 255 255
The bright and varied shades of blue in our secondary palette reflect our diversity and inclusive growth business model. These colors are used to bring attention to key design elements and important user content across the Trepup brand.
HEX: 1565c0
RGB: 21 101 192
HEX: 2979ff
RGB: 41 121 255
HEX: 448aff
RGB: 68 138 255
HEX: 2196f3
RGB: 33 150 243
HEX: 42a5f5
RGB: 66 165 245
HEX: 90caf9
RGB: 144 202 249
HEX: bbdefb
RGB: 187 222 251
HEX: e3f2fd
RGB: 227 242 253
The specialty colors are designated for illustrations that require tone-on-tone pairings, and for product designs that require variations of tone and opacity.
HEX: fbbc05
RGB: 251 188 5
HEX: 34a853
RGB: 52 168 83
HEX: 4285f4
RGB: 66 133 244
HEX: aa00ff
RGB: 170 0 255
HEX: ea4335
RGB: 234 67 53
HEX: ff9800
RGB: 255 152 0
You may consider our color palette in your design when incorporating Trepup Marks. However, you must not use the colors in your design in any manner that may attribute third-party material to Trepup and be confusingly similar to or indicative of Trepup Marks.
Typography
Typography is fundamental to Trepup's design and readability. The Roboto font is used to provide a consistent reading experience regardless of the screen size and resolution.
Headline
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
Subtitle
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
Body
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
You may consider the Roboto font in your design when incorporating Trepup Marks. However, you must not use the font in any manner that may attribute third-party material to Trepup and be confusingly similar to or indicative of Trepup Marks.
Iconography
Trepup icons are drawn on a pixel-based grid with a size of 24 x 24 pixels using a two-pixel stroke width for outlines. Each frame includes keylines and a two-pixel padding on all sides as guidance. It is acceptable to go beyond the padding or off the keylines if doing so improves the optical balance of the icon.
Square height and width 18dp
Icon drawn using square keyline
Icon drawn using circle keyline
Vertical rectangle height 20dp and width 16dp
Icon drawn using vertical rectangle keyline
Horizontal rectangle height 16dp and width 20dp
Icon drawn using horizontal rectangle keyline
Do
Position the icon "on pixel" within the icon grid
Don't
Don't position the icon on a coordinate that isn't "on pixel"
Our icons simplify complex ideas into visual content. The icons illustrate product features and concepts to help users process information efficiently. Examples of our icons in unfilled and filled states include the following:
You may consider our iconography in your design when incorporating Trepup Marks. However, you must not use the icons in any manner that may attribute third-party material to Trepup and be confusingly similar to or indicative of Trepup Marks.