Skip to main contentIBM Developer Experience Guide

Color

The IBM Developer color palette is a subset of the broader IBM palette. The vibrant hues chosen were inspired by syntax highlighting used in coding. To learn more about the IBM color palette, please visit the IBM color page.

IBM Developer color palette

These are the eight hues, plus IBM Black and IBM White, that make up the IBM Developer color palette. You can find the specific color values for use in digital or print color spaces under Specifications on the IBM color page.

IBM Developer color palette montage
blue 600f62fe
black 100000000
white 0ffffff
cyan 3082cfff
purple 40be95ff
magenta 40ff7eb6
teal 303ddbd9
cyan 10e5f6ff
cool gray 10f2f4f8
cool gray 30c1c7cd

Color combinations

Colors within the IBM Developer primary palette can be used on their own, or in pairs. Only the pairings shown here are approved within the IBM Developer system.

Cool Gray 30 pairings

blue 60
cyan 30
purple 40
magenta 40
teal 30
cyan 10
cool gray 10

Cool Gray 10 pairings

blue 60
cyan 30
purple 40
magenta 40
teal 30

Cyan 10 pairings

blue 60
cyan 30
purple 40
magenta 40
teal 30

Color blocks

Color blocks are an effective element when you want to incorporate color. The baseline of type should sit at the bottom of the color block.

Color block with proper text placement on grid wireframe

Color bars

In a nod to highlighting found in code syntax, the IBM Developer brand system uses color bars as a design element. They begin at the baseline of type, and their thickness is half the distance to the cap height of the next line of text.

Color bar alignment to grid wireframe