This guide will serve as a home base for the Red Hat Developer story, messaging, and visual brand language. It's a place you can always return to when you have questions about how to best represent Red Hat Developer through messaging or visual elements.
Local Setup and Development | Contributing
Red Hat Developer will continuously evolve, grow, and expand to adapt to new tools and practices. But there are key elements about Red Hat Developer that will never change. This document captures the foundational story and messaging elements core to the Red Hat Developer story.
Our brand—our reputation—is most clearly communicated when how we think is aligned with how we look, sound, and act.
The Organizing Principle is an internal dynamic concept, an overarching idea that defines how we want to look, sound, and act. Whether you're writing headlines for a marketing campaign, creating images for social media, or engaging with community members at an event, this Organizing Principle is a powerful inspirational tool that should help shape the representation of Red Hat Developer.
This document is a tool for internal use—to refer to whenever you have questions about the story. That said, this story and messaging guide is not meant to limit your creativity, but instead help guide any future content creation, marketing materials, or campaigns.
Messaging Principles
Messaging Architecture
Supporting Headlines
This visual guide will serve as a home base for Red Hat Developer's visual brand language. It's a place you can always return to when you have questions about visual elements for Red Hat Developer, or when you're creating brand materials.
The visual guide is for internal use, to help you ensure you're creating a cohesive visual experience for customers across all brand touchpoints. It's meant to be a living, breathing document—a place where you can continue building your visual language to reflect changes in the brand.
The Red Hat Developer logo family is a unique system that distinguishes our organization from all others. Use of the logo, typography, and color should follow the guidelines within this document so that we present a consistent image to our various audiences.
Clear Space When we place other design elements too close to the logo family it can sometimes suggest a relationship between them. Think of the logo family as our signature. The more we keep it intact, the more recognizable and valuable it will be. To maintain the integrity of the Red Hat Developer identity, keep a fixed amount of open space around each logo to help it stand out.
Files
| Name | Usage | SVG | PNG |
|---|---|---|---|
| Full Logo Full-Color | This is the primary version of the logo to be used on light or white backgrounds |  |
 |
| Full Logo Full-Color (black background) | This is the primary version of the logo to be used on dark gray or black backgrounds |  |
 |
| Full Logo 4-color | This version of the logo should only be used when printing limitations restrict the use of the full-color logo |  |
 |
| Full Logo 4-color (black background) | This version of the logo should only be used when printing limitations restrict the use of the full-color logo |  |
 |
| Full Logo Black | This version of the logo should be used when printing in black and white (over a light background), or whenever the background competes with the full-color logo but is too light for the white version of the logo |  |
 |
| Full Logo White (black background) | This version of the logo should be used when printing in black and white (over a dark background), or when the background color is the same as one of the colors in the full-color logo, or whenever the background competes with the full-color logo |  |
 |
| Mark Full-Color | This is the primary version of the logo to be used on light or white backgrounds |  |
 |
| Mark Full-Color (black background) | This is the primary version of the logo to be used on dark gray or black backgrounds |  |
 |
| Mark 4-color | This version of the logo should only be used when printing limitations restrict the use of the full-color logo |  |
 |
| Mark 4-color (black background) | This version of the logo should only be used when printing limitations restrict the use of the full-color logo | |
|
| Mark White (red background) | This version of the logo should be used when printing in black and white (over a dark background), or when the background color is the same as one of the colors in the full-color logo, or whenever the background competes with the full-color logo |  |
 |
| Mark Black | This version of the logo should be used when printing in black and white (over a light background), or whenever the background competes with the full-color logo but is too light for the white version of the logo |  |
 |
| Name | HEX | RGB | CMYK | PMS | Sample |
|---|---|---|---|---|---|
| Light Red | #CC0000 |
204, 0, 0 |
2, 98, 85, 2 |
1797 |
|
| Dark Red | #820000 |
130, 0, 0 |
2, 98, 85, 42 |
1815 |
|
| Light Yellow | #F0AB00 |
240, 171, 0 |
0, 30, 100, 0 |
130 |
|
| Dark Yellow | #EC7A08 |
236, 122, 8 |
0, 55, 90, 0 |
716 |
|
| Light Green | #92D400 |
146, 212, 0 |
47, 0, 94, 0 |
375 |
|
| Dark Green | #3F9C35 |
63, 156, 53 |
78, 2, 98, 9 |
362 |
|
| Light Blue | #00B9E4 |
0, 185, 228 |
79, 0, 6, 5 |
306 |
|
| Dark Blue | #0088CE |
0, 136, 206 |
79, 13, 1, 3 |
Process Blue |
|
| Black | #000000 |
0, 0, 0 |
60, 40, 40, 100 |
Rich Black |
|
| Developer White | #F9F9F9 |
249, 249, 249 |
0, 0, 0, 0 |
White |
The relationship between fonts give a brand its identity and its messages a voice. When used effectively, typography plays a critical role in establishing the tone of Red Hat Developer's brand expression. Our typography should follow the Red Hat parent brand guidelines.
| Typeface | Description | Example | Uses | Files |
|---|---|---|---|---|
| Interstate | Interstate is our corporate typeface. It’s part of a large and versatile type family, which allows us to speak in many voices—from big and bold to calm and confident. Interstate looks best in print and when used for big headlines. We use it for all printed material, like collateral and stationery; for advertising, like printed ads and web banners; and anywhere text is embedded in an image, like diagrams and videos. |
 |
 |
Interstate family |
| Overpass | Overpass is an open-licensed alternative to Interstate that is specifically for use on-screen and in our software. Like Interstate, Overpass is based on the FHWA (Federal Highway Administration) series of fonts, which has been used for US Highway signage since 1945. Overpass can be used in a lot of the same ways as Interstate. We use Overpass for all web text, editable presentations, and product interfaces. |
 |
 |
Overpass family |
| Liberation | Liberation is metrically equivalent to the default fonts on non-Linux platforms. That means there are fewer issues with font conflicts and formatting when a document moves between platforms. Use Liberation Sans for live, editable documents that will be shared outside of Red Hat. Use Liberation Mono for code samples. |
 |
 |
Liberation family |
These are the primary visual elements that should be used whenever outward facing visual pieces need additional texture or visual support.
Universal Code Block
The Universal Code Block provides visual context for the story behind the Red Hat Developer mark. When the mark needs background texture or additional visual support, the Universal Code Block should be used if possible. When at scale, the mark should be placed on top of the Universal Code Block like a puzzle piece (shown below), but the Universal Code Block can also be blown up or sized down as a layered textural element.
The Universal Code Block should always be left aligned, to communicate that it is an abstraction of code. It can be indented in sections to further communicate this idea, but it doesn't have to be. The Universal Code Block should be grayscale when the logo is present, but can be colorful if it is being used as a stand-alone visual element.
| Name | SVG | PNG |
|---|---|---|
| Universal Code Block Light Background |  |
 |
| Universal Code Block Dark Background |  |
 |
Merging Branches
The Merging Branches are inspired by gitbranches, a representation of the everyday development process. This full color version is a blueprint–a starting point for an endlessly flexible visual element. It can be as many or as few colors as needed (pulled from the RHD palette of course). It can contain many branches or few, as long as it is always merging toward a single branch, moving from left to right.
Unlike the Universal Code Block, the logo should never rest on top of the Merging Branches. Instead, it should live in the space around the Merging Branches, wherever makes sense in order to create a strong and balanced composition.
As an addition treatment, the Merging Branches can be visualized with a tilt-shift with a selective focus (as shown in the email header examples below). This treatment should be used sparingly, or as a dynamic solution when dimensions are not ideal for a strong composition using the full Merging Branches graphic.
Secondary visual elements can be used for promotional or one-off pieces, subtle or supporting background texture, or any secondary/tertiary level branded piece that may need additional visual support.
Morse Code
The visual elements that make the Red Hat Developer mark can be rearranged in infinite combinations to create unique structures of units and paths. When combined with one of the most iconic coding languages–Morse code–we can create visuals with an underlying layer of meaning, a secret treat for those who can see it. Using the international rules of Morse code along with some specific Red Hat Developer Rules, we can create beautiful abstract shapes that contain messages, words, and ideas that resonate with our audiences.
The first rule of the Morse code visual element is: you do not talk about the Morse code visual element. We don't ever want to directly address that there is an underlying meaning in these visuals; it exists only for those who can find it. We know that developers are perceptive, curious, detail-oriented problem solvers. They're our people. This visual treatment is like our secret handshake.
Copyright (c) 2018-2020 by Red Hat Developer Program.