PatternFly

PatternFly / 2012– / Style / Platform Screen Languages

Red Hat's open-source screen language for enterprise products keeps complex infrastructure manageable through dense navigation, data views and tightly controlled status color.

PatternFly — PatternFly — official desktop data-list demo snapshot — Copyright (c) 2019 Red Hat, Inc. / MIT
PatternFly — official desktop data-list demo snapshot — Copyright (c) 2019 Red Hat, Inc. / MIT · MIT
PatternFly — AI-generated interpretation 1
AI-generated interpretation, not a reference work
PatternFly — AI-generated interpretation 2
AI-generated interpretation, not a reference work

At a glance

Visual cues

  • Dark masthead and left navigation
  • Dense tables and forms on white or pale-gray work surfaces
  • Blue for primary action and red, orange or green for status
  • List, detail and action shown in coordinated panes

Best used for

  • Administration products for cloud, containers and networks
  • Giving a suite of enterprise products one density, navigation and status language

Use this style

Take the compact brief into a project or hand the structured version to an AI tool.

Detailed guidance and sourcesProduction rules, reference works, comparisons, research and citation formats

Dictionary entry

Type
Keep headings, body and table labels to a small hierarchy; distinguish values and code with monospace.
Composition
Separate dark shell, left navigation, work surface and an on-demand detail pane.
Material
Use white and pale gray broadly, blue for action and saturated color only for alerts and status.
Caution
Packing cards and tables together is not enough. Make current location and the priority of abnormal states obvious first.
Further study
PatternFly design foundations / Enterprise navigation and data views / Red Hat product applications

Related entries

More from Platform Screen Languages

Continue through styles in the same Platform Screen Languages family, prioritised by shared effects.

Browse all Platform Screen Languages entries

Cite this entry

The dictionary is meant to be linked to. Take whichever form fits where you are writing.

Link
https://indexstyle.org/styles/patternfly
Markdown
[PatternFly — IndexStyle](https://indexstyle.org/styles/patternfly)
HTML
<a href="https://indexstyle.org/styles/patternfly">PatternFly — IndexStyle</a>

Back to index position