HPE Design System Foundation
HPE
Design System
Foundation
Components
Templates
Extend

Foundation

These are the core elements of HPE that encompass the voice, language, and visuals that personify our brand and help establish and identify it from the rest of the community.

Philosophy

HPE Accessibility Preview
Foundation
Accessibility
Central to the HPE Design System, accessibility is incorporated into all Design System facets, ensuring HPE applications are usable by as many people as possible.
HPE Philosophy Preview
Foundation
Philosophy and Principles
What the HPE Design System is and why we’re creating it.
HPE Developer Guidance Preview
Foundation
Developer Guidance
Resources for setting up your application with the HPE Design System library and HPE theme.
HPE Designer Guidance Preview
Foundation
Designer Guidance
Starter files, patterns, interactions, and workflows on how to succeed using the design resources from HPE Design System and the HPE Brand.
HPE Human Centered
Foundation
Human Centered
The starting point of the design system is human centered, generating experiences which are inclusive and vibrant.
HPE T-shirt Sizing Preview
Foundation
T-shirt Sizing
Create consistent, composable interfaces with t-shirt sizing.
HPE Voice and Tone Preview with two speech bubbles
Foundation
Voice and Tone
Deliver clear, consistent experiences to HPE customers by following guidelines for the voice and tone of text-based user interface elements.

Assets

HPE Our Brand Preview
Foundation
Our Brand
The Element is about focus. It creates momentum and energy. It is a building block. It can move, change, expand, and constrain. It works across many touch points.
Foundation
Distinctive Brand Assets
Our distinctive brand assets are comprised of the top elements that are always used, along with several optional components that can be added.
HPE Color Preview
Foundation
Color
Bringing out the depth and dimension of our identity, the HPE Design System use of color evokes energy and inspiration.
HPE Background Colors Preview
Foundation
Background Colors Guidance
Leverage HPE background colors to seamlessly style your layout.
HPE Typography Preview
Foundation
Typography
The MetricHPE font is an integral part of our personality and design. When we’re making a statement, our visual language is clear, recognized and understood.
Hpe Icon Preview
Foundation
Icons
Icons are an integral part of our visual storytelling style to represent objects, actions, programs and other communicative symbols. This clean, dynamic style remains flexible while retaining the voice of our brand.