UnderCodes brand book
Brand book · Guides for visual identity
A story under every line of code
Una historia bajo cada línea de código
Logo
Keep x clear on every side. x = height of the D.
Versions
- #C31D1D / #27292B
-
#C31D1D → #27292B - #27292B
-
#27292B → #C31D1D - #F94A28
-
#27292B → #9B9B9B
- #C31D1D
-
#C31D1D → #27292B - #FFFFFF
-
#C31D1D → #93BC00 - #F73434
-
#9B9B9B → #FFFFFF
Do
- Every functional color
Don't
Reductions
- 64 px
- 32 px
- 16 px
Color
Red leads. Everything else supports it.
-
Primary
-
-
Secondary
-
-
-
-
-
-
-
Typography
undercodes
undercodes
Red Hat Display
Corporate typing: headings and display
a b c d e f g h i j k l m n o p q r s t u v w x y z
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
0 1 2 3 4 5 6 7 8 9
! $ % . -
Source Code Pro
General typing: body, labels and code
a b c d e f g h i j k l m n o p q r s t u v w x y z
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
0 1 2 3 4 5 6 7 8 9
! $ % . -
A story under every line of code
A story under every line of code
The icon
The snake head, for small spaces.
Textures & patterns
Textures simulate physical surfaces: paper grain, fabric weave, metal scratches. Patterns repeat a motif. Both add depth, tactility and consistency.
Extra material
Applications
-
Business card: dark stock, red snake, QR to the site -
Letterhead: snake skin bleeding off the edge, Source Code body -
Billing: quotes with corporate-red headings -
Social: posts on Charcoal #27292B with red accents -
Phones: wallpapers, light and dark -
Full Blue: the blue alternative, #005EBC -
Pins: red, and green #93BC00 on black -
Bottles: the hooded figure and the scaled snake -
App icon: the snake-head alternative icon
Take the brand with you
Logos in vector and the full palette, ready for your next piece.
A story under every line of code.