Brand Integration

Red Hat Branded Assets

RCUE is built on the PatternFly framework. The PatternFly framework is available through a public GitHub repository. This includes most patterns and widgets, but not all. We are adding new content all of the time.

We have a separate GitHub repo which contains Red Hat brand specific styling on top of the PatternFly framework. By utilizing this code your project will pull in modified CSS and Red Hat specific imagery. If this will be your first time accessing the RCUE repository, contact us to be granted access.

The Masthead

The masthead includes the header area at the top-most portion of the screen. It is a persistent design element that appears on most, if not all, screens. Due to its location on the screen, high-priority and/or global design elements are placed within the masthead. All Red Hat web applications must include a common masthead as shown below:

RH-Nav-Branding2
  • (A) Logo area. The logo area is in the upper-left corner of the masthead. It contains the application product name image file. The product logotype should always by included in the form of a sized SVG graphic.  This will ensure correct rendering for all browsers and screen resolutions. Use of a PNG graphic is also acceptable as an alternate choice. If you need a logotype graphic for your product, contact the UXD team and we’ll be glad to make one for you.
  • (B) Utility area. The Utility area is in the upper-right corner of the masthead. It contains the login affordance, at minimum. Other utility links may reside in this area. If provided, additional utility links would be presented to the left of the Login affordance.
  • (C) Primary navigation area. The Primary navigation area resides below the Logo and Utility areas. It spans the full width of the banner and offers tabbed navigation.

Login screen

The common login screen should be used for all Enterprise web applications that have adopted RCUE. This screen includes a larger version of the product logotype and the Red Hat shadowman logo in the upper right. For more information about the behaviors associated with the login screen, see the Login/Logout pattern in PatternFly.

Red Hat Common User experience login screenshot