HPE
Design System
Foundation
Components
Templates
Extend

Design, develop and deliver

Empower designers and developers to quickly create accessible enterprise app experiences.

Designer Guidance

Starter files to utilize our resources from HPE Design System and HPE Brand.

Developer Guidance

Resources for setting up your application with the HPE Design System library and HPE theme.

What's New

Track announcements, new template patterns, guidance, and released components.

What is the HPE Design System?

The HPE Design System was created to empower designers, developers, and others in contributing to an evolving design language that supports HPE's pursuit in making great customer app experiences. For other contexts checkĀ HPE Brand Central.

Base elements

Base elements and styles form the rudiments of composition.

Combining elements

Combining base elements to make templates.

Tools

Use tools to help expand and connect elements.

Tailored solution

Tailor the code, resources, and tools into one solution.

Application

Put it all together to make an application.

Highlights

The HPE Design System team is committed to conducting thorough research so you don't have to think about it. Just find what you need, design and deliver quickly!

Color highlights
Color

Translated for code, light/dark themes, status, and more*

Icon highlights
Icons

500+ icons/glyphs that can be scaled and styled easily

Header highlights
Header

A variety of HPE headers supply consistent navigation types

Typography highlights
Typography

Text styles for the HPE Metric font to work in various view contexts

Forms highlights
Forms

A variety of templates to engage with your users

Table highlights
DataTable

A DataTable is a structure of data made up of rows and columns

Accessibility highlights
Accessibility

Ensure access to your experience no matter who the user is

Page Layout highlights
Page Layouts

Common designs for building your enterprise experience

Grid highlights
Grid

An important component used to layout content

Show Me More
Tim HarmsCreative Director, HPE Global Brand

The HPE Design System empowers developers, designers and others to create consistent, accessible and flexible interfaces.

quote lines
start of quote
end of quote

Community

The HPE Design System is an open-source framework for designers and developers. We welcome feedback, ideas and appreciate your suggestions.

Slack

Specific questions? Want feedback or advice?
Join us on Slack

Roadmap

Stay in the loop and checkout what's next!
View Roadmap

Backlog

Eager to know what's marinating in the back?
View Backlog

Feedback

Let us know your feedback!
Provide feedback