Colour palette

Ubuntu colour pantones

Colour is an effective, powerful and instantly recognisable medium for visual communications. To convey the brand personality and brand values, there is a sophisticated colour palette.

We have introduced a palette which includes both a fresh, lively orange, and a rich, mature aubergine. The use of aubergine indicates commercial involvement, while orange is a signal of community engagement.

These colours are used widely in the brand communications, to convey the precise, reliable and free personality.

Ubuntu core colours

The Ubuntu colour palette has been created to reflect the spirit of our brand. Orange for a community feel. White for a clean, fresh and light feel.

Black is used in some versions of the brandmark for flexibility of application and where print restrictions apply. It can also be used for body copy.

Ubuntu orange

Ubuntu orange

Screen
HEX #DD4814
Print
C0 M79 Y100 K0
Pantone 1665


White

White

Screen
HEX #FFFFFF
Print
C0 M0 Y0 K0


Black

Black

Screen
HEX #000000
Print
C0 M0 Y0 K100


Please note: Pantone Matching System is a worldwide printing, publishing and packaging language for the selection, marketing and control of colour. PANTONEĀ® is a registered trademark of Pantone Inc.

Supporting colours

In addition, there is a supporting colour palette for when communications have a consumer or enterprise focus.

  • Light aubergine for a consumer focus
  • Dark aubergine for an enterprise focus
  • Mid aubergine for a balance of both

Light aubergine

Light aubergine

Screen
HEX #77216F
Print
C60 M100 Y15 K5
Pantone 512


Mid aubergine

Mid aubergine

Screen
HEX #5E2750
Print
C70 M100 Y50 K20
Pantone 511


Dark aubergine

Dark aubergine

Screen
HEX #2C001E
Print
C66 M98 Y21 K85
Pantone 7449


Neutral colours

Warm grey

For balance. The addition of warm grey softens the combination of orange and aubergine and provides a bridge between the two.

Warm grey can be used for; backgrounds, graphics, pictograms, dot patterns, charts and diagrams. It can also be used for large size text.

Cool grey

For typography, particularly body copy. Black can be quite harsh in combination with aubergine, but grey delivers more balance while still being legible.

Cool grey can also be used within charts and diagrams.

Warm grey

Warm grey

Screen
HEX #AEA79F
Print
C0 M5 Y10 K29
Pantone Warm Grey 5


Cool grey

Cool grey

Screen
HEX #333333
Print
C44 M34 Y22 K78
Pantone Cool Grey 11


Small dot grey

Small dot grey

Screen
HEX #AEA79F
Print
C0 M0 Y10 K29
Pantone Warm Grey 5


Text grey

Screen
HEX #333333
Print
C0 M0 Y0 K70
Pantone Cool Grey 11

Text grey is used for small size headings, sub-headings and body copy text only.

Canonical core colours

The Canonical colour palette has been created to reflect the spirit of our brand. Aubergine for a smart, focussed feel. White for a clean, fresh and light feel.

Canonical aubergine

Canonical aubergine

Screen
HEX #772953
Print
C26 M99 Y12 K52
Pantone 683


White

White

Screen
HEX #FFFFFF
Print
C0 M0 Y0 K0

Tints

Tints of the above palette colours can be used as background colours and in charts and diagrams when a clear visual hierarchy of information is needed.

Tint percentages

Use only the percentages shown on this page. Never use a tint less than 10%.

  1. Ubuntu Orange

    100%#DD4814

  2. 90%#E05A2B
  3. 80%#E36C43
  4. 70%#E77E5A
  5. 60%#EA9172
  6. 50%#EEA389
  7. 45%#EFAC95
  8. 40%#F1B5A1
  9. 35%#F3BEAC
  10. 30%#F4C8B8
  11. 25%#F6D1C4
  12. 20%#F8DAD0
  13. 15%#F9E3DB
  14. 10%#FBECE7
  1. Canonical Aubergine

    100%#772953

  2. 90%#843E64
  3. 80%#925375
  4. 70%#9F6986
  5. 60%#AD7E97
  6. 50%#BB94A9
  7. 45%#C19EB1
  8. 40%#C8A9BA
  9. 35%#CFB4C2
  10. 30%#D6BECB
  11. 25%#DDC9D4
  12. 20%#E3D4DC
  13. 15%#EADEE5
  14. 10%#F1E9ED
  1. Light Aubergine

    100%#77216F

  2. 90%#84377D
  3. 80%#924D8B
  4. 70%#9F639A
  5. 60%#AD79A8
  6. 50%#BB90B7
  7. 45%#C19BBE
  8. 40%#C8A6C5
  9. 35%#CFB1CC
  10. 30%#D6BCD3
  11. 25%#DDC7DB
  12. 20%#E3D2E2
  13. 15%#EADDE9
  14. 10%#F1E8F0
  1. Mid Aubergine

    100%#5E2750

  2. 90%#6E3C61
  3. 80%#7E5273
  4. 70%#8E6784
  5. 60%#9E7D96
  6. 50%#AE93A7
  7. 45%#B69DB0
  8. 40%#BEA8B9
  9. 35%#C6B3C1
  10. 30%#CEBECA
  11. 25%#D6C9D3
  12. 20%#DED3DC
  13. 15%#E6DEE4
  14. 10%#EEE9ED
  1. Dark Aubergine

    100%#2C001E

  2. 90%#411934
  3. 80%#56334B
  4. 70%#6B4C61
  5. 60%#806678
  6. 50%#957F8E
  7. 45%#A08C99
  8. 40%#AA99A5
  9. 35%#B5A5B0
  10. 30%#BFB2BB
  11. 25%#CABFC6
  12. 20%#D4CCD2
  13. 15%#DFD8DD
  14. 10%#E9E5E8
  1. Warm Grey

    100%#AEA79F

  2. 90%#B6AFA8
  3. 80%#BEB8B2
  4. 70%#C6C1BB
  5. 60%#CECAC5
  6. 50%#D6D3CF
  7. 45%#DAD7D3
  8. 40%#DEDBD8
  9. 35%#E2E0DD
  10. 30%#E6E4E2
  11. 25%#EAE9E7
  12. 20%#EEEDEB
  13. 15%#F2F1F0
  14. 10%#F6F6F5

The amount of colour we use

Colour pie chart

Our colour palette consists of orange, aubergine, white and warm grey. The amount of colour we use for community and Canonical collateral varies according to the emphasis of the content.

At one end of the scale, where the work is dominated by the community, the emphasis is on a fresh palette, the use of white and orange, and warm grey for balance. Aubergine is used only as a highlight.

At the other end of the scale, where the work is more focused on Canonical, the palette is more refined and grounded, with much more emphasis on aubergine as the core colour. Orange is only used as a highlight and we use white and warm grey to complement the orange and aubergine.

The voice slider determines colour balance

Learn about the voice, audience and developer sliders

Community to Canonical

The voice slider determines the balance of colour in your work. In each case, there are variations depending on how much textual content your work contains: where we are content-heavy we tend to use more white as a background for the text.

Community

Voice Slider Colours: Community
The dominant colour should be Ubuntu orange. Use white and warm grey as secondary colours.

A mix of community and Canonical

Voice Slider Colours: Both Community and Canonical
Ubuntu orange and Canonical aubergine are the dominant colours. White and warm grey as secondary colours.

Canonical

Voice Slider Colours: Canonical
The dominant colour should be Canonical aubergine. White and warm grey as secondary colours. A hint of Ubuntu orange should also be used if your communication features an Ubuntu product.

When creating a generic work based solely on the voice slider setting use the colour balances described above. The audience and developer sliders can also influence the choice and balance of colours.

Colour balance breakdown example

Voice slider: a mix of community and Canonical
Here is a guide for a content heavy communication when the voice slider is set to a mix of community and Canonical. This example shows the proportion of colour and hierarchy on this communication.

Colour balance

The colour balance on a content heavy communication

  • Ubuntu orange and Canonical aubergine are the dominant colours. When an Ubuntu product is being promoted the orange band sits above the aubergine band.
  • White is a background for content.
  • Cool grey is used for the copy colour.
  • Warm grey is a secondary colour. For example, it can be used as the dot pattern colour.

Varying the aubergine based on the audience slider

Darker tones show stronger enterprise weighting

The voice slider gives you the basic balance of orange and aubergine. The audience slider varies the exact tone of aubergine that is appropriate. The more heavy the enterprise weighting in the audience slider, the darker the tone of aubergine you should use.

Consumer

Audience Slider Colours: Consumer
When the community communicates to consumers, light aubergine is featured. The dominant colours become Ubuntu orange and light aubergine – use white and warm grey as secondary colours.

A mix of consumer and enterprise

Audience Slider Colours: Both
When communicating to a mix of consumers and enterprise users mid aubergine is featured. The dominant colours become Ubuntu orange and mid aubergine – use white and warm grey as secondary colours.

Enterprise

Audience Slider Colours: Enterprise
When communicating to enterprise users dark aubergine is featured. The dominant colours should be Ubuntu orange and dark aubergine – use white and warm grey as secondary colours.

Combining tones of aubergine where needed

Work can include both Canonical and audience-specific tones

The examples below all have the voice slider set to a mix of community and Canonical. The audience slider varies, introducing the darker tones of aubergine. The work can include elements in both the Canonical and audience-specific tone of aubergine, and the balance is described below:

Consumer

Aubergine Mix: Consumer
When the community communicates to consumers light aubergine is featured. The dominant colours become Ubuntu orange, light aubergine and Canonical aubergine – use white and warm grey as secondary colours.

Mix of consumer and enterprise

Aubergine Mix: Both
When communicating to a mix of consumers and enterprise users mid aubergine is featured. The dominant colours become Ubuntu orange, mid aubergine and Canonical aubergine – use white and warm grey as secondary colours.

Enterprise

Aubergine Mix: Enterprise
When communicating to enterprise users dark aubergine is featured. The dominant colour becomes dark aubergine, Ubuntu orange and Canonical aubergine – use white and warm grey as secondary colours.

Retaining orange as a highlight

Consumer

Retain Orange: Consumer
When Canonical communicates to consumers light aubergine is featured. The dominant colours become light aubergine – keep a highlight of Ubuntu orange and use Canonical aubergine, white and warm grey as secondary colours.

Mix of consumer and enterprise

Retain Orange: Both
When communicating to a mix of consumers and enterprise users mid aubergine is featured. The dominant colour becomes mid aubergine – keep a highlight of Ubuntu orange and use Canonical aubergine, white and warm grey as secondary colours.

Enterprise

Retain Orange: Enterprise
When communicating to enterprise users dark aubergine is featured. The dominant colour become dark aubergine – keep a highlight of Ubuntu orange and use Canonical aubergine, white and warm grey as secondary colours.

Colour Balance Breakdown Example

Canonical to enterprise audience
Here is a guide for a content light communication when the voice slider set to Canonical and the audience slider set to enterprise. This example shows the proportion of colour and hierarchy on this communication.

Colour Balance

The colour balance on a content light communication