The colours specified below should be used for all St.George user interfaces. It’s important to understand how the colour system works in a multi-brand environment. It’s also very important to adhere to the accessibility guidelines.

Colors

1.0.0

Primary UI Palette

These are the ten core colours used in the digital brand. It's important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

D
Complementary A

#008739

E
Complementary B

#FFCD00

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

These colours add variation to the palette. They are commonly used for content specific tasks such as charts, info graphics, diagrams etc.

Ember

#F68D39

Citrus

#F8DF5C

Spring

#DDDF4B

Sky

#3FC3EB

Plumb

#502D79

Neutral Tints

Each brand has a neutral colour with a set of eleven tints for subtle colouring. Three of these tints are already used in the primary palette for borders backgrounds and super light backgrounds.

100%
Muted text

#757463

90%

#838273

80%

#919082

70%

#9e9e92

60%

#ACACA1

50%

#BAB9B1

40%
Borders

#C8C7C1

30%

#D6D5D0

20%

#E3E3E0

10%
Background

#F1F1EF

5%
Light

#F8F8F7

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A. Yes
ACCESSIBLE

#E30000

B. No
NOT ACCESSIBLE

#78BE20

C. Yes
ACCESSIBLE

#858370

D. Yes
ACCESSIBLE

#008739

E. No
NOT ACCESSIBLE

#FFCD00

F. Yes
ACCESSIBLE

#004833

G. Yes
ACCESSIBLE

#858370

Reserved Colours

These are important contextual colours used throughout the interface. Do not use these colours for any other purpose than shown here. All these colours are accessible. Do not use these colours for any other purpose than shown here.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

1.0.1

Primary UI Palette

These are the ten core colours used in the digital brand. It's important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

D
Complementary A

#008739

E
Complementary B

#FFCD00

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

These colours add variation to the palette. They are commonly used for content specific tasks such as charts, info graphics, diagrams etc.

Ember

#F68D39

Citrus

#F8DF5C

Spring

#DDDF4B

Sky

#3FC3EB

Plumb

#502D79

Neutral Tints

Each brand has a neutral colour with a set of eleven tints for subtle colouring. Three of these tints are already used in the primary palette for borders backgrounds and super light backgrounds.

100%
Muted text

#757463

90%

#838273

80%

#919082

70%

#9e9e92

60%

#ACACA1

50%

#BAB9B1

40%
Borders

#C8C7C1

30%

#D6D5D0

20%

#E3E3E0

10%
Background

#F1F1EF

5%
Light

#F8F8F7

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A. Yes
ACCESSIBLE

#E30000

B. No
NOT ACCESSIBLE

#78BE20

C. Yes
ACCESSIBLE

#858370

D. Yes
ACCESSIBLE

#008739

E. No
NOT ACCESSIBLE

#FFCD00

F. Yes
ACCESSIBLE

#004833

G. Yes
ACCESSIBLE

#858370

Reserved Colours

These are important contextual colours used throughout the interface. Do not use these colours for any other purpose than shown here. All these colours are accessible. Do not use these colours for any other purpose than shown here.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

2.0.0

Primary UI Palette

These are the ten core colours used in the digital brand. It's important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

D
Complementary A

#008739

E
Complementary B

#FFCD00

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

These colours add variation to the palette. They are commonly used for content specific tasks such as charts, info graphics, diagrams etc.

Ember

#F68D39

Citrus

#F8DF5C

Spring

#DDDF4B

Sky

#3FC3EB

Plumb

#502D79

Neutral Tints

Each brand has a neutral colour with a set of eleven tints for subtle colouring. Three of these tints are already used in the primary palette for borders backgrounds and super light backgrounds.

100%
Muted text

#757463

90%

#838273

80%

#919082

70%

#9e9e92

60%

#ACACA1

50%

#BAB9B1

40%
Borders

#C8C7C1

30%

#D6D5D0

20%

#E3E3E0

10%
Background

#F1F1EF

5%
Light

#F8F8F7

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A. Yes
ACCESSIBLE

#E30000

B. No
NOT ACCESSIBLE

#78BE20

C. Yes
ACCESSIBLE

#858370

D. Yes
ACCESSIBLE

#008739

E. No
NOT ACCESSIBLE

#FFCD00

F. Yes
ACCESSIBLE

#004833

G. Yes
ACCESSIBLE

#858370

Reserved Colours

These are important contextual colours used throughout the interface. Do not use these colours for any other purpose than shown here. All these colours are accessible. Do not use these colours for any other purpose than shown here.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

2.0.1

Primary UI Palette

These are the ten core colours used in the digital brand. It's important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

D
Complementary A

#008739

E
Complementary B

#FFCD00

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

These colours add variation to the palette. They are commonly used for content specific tasks such as charts, info graphics, diagrams etc.

Ember

#F68D39

Citrus

#F8DF5C

Spring

#DDDF4B

Sky

#3FC3EB

Plumb

#502D79

Neutral Tints

Each brand has a neutral colour with a set of eleven tints for subtle colouring. Three of these tints are already used in the primary palette for borders backgrounds and super light backgrounds.

100%
Muted text

#757463

90%

#838273

80%

#919082

70%

#9e9e92

60%

#ACACA1

50%

#BAB9B1

40%
Borders

#C8C7C1

30%

#D6D5D0

20%

#E3E3E0

10%
Background

#F1F1EF

5%
Light

#F8F8F7

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A. Yes
ACCESSIBLE

#E30000

B. No
NOT ACCESSIBLE

#78BE20

C. Yes
ACCESSIBLE

#858370

D. Yes
ACCESSIBLE

#008739

E. No
NOT ACCESSIBLE

#FFCD00

F. Yes
ACCESSIBLE

#004833

G. Yes
ACCESSIBLE

#858370

Reserved Colours

These are important contextual colours used throughout the interface. Do not use these colours for any other purpose than shown here. All these colours are accessible. Do not use these colours for any other purpose than shown here.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

2.0.2

Primary UI Palette

These are the ten core colours used in the digital brand. It's important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

D
Complementary A

#008739

E
Complementary B

#FFCD00

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

These colours add variation to the palette. They are commonly used for content specific tasks such as charts, info graphics, diagrams etc.

Ember

#F68D39

Citrus

#F8DF5C

Spring

#DDDF4B

Sky

#3FC3EB

Plumb

#502D79

Neutral Tints

Each brand has a neutral colour with a set of eleven tints for subtle colouring. Three of these tints are already used in the primary palette for borders backgrounds and super light backgrounds.

100%
Muted text

#757463

90%

#838273

80%

#919082

70%

#9e9e92

60%

#ACACA1

50%

#BAB9B1

40%
Borders

#C8C7C1

30%

#D6D5D0

20%

#E3E3E0

10%
Background

#F1F1EF

5%
Light

#F8F8F7

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A. Yes
ACCESSIBLE

#E30000

B. No
NOT ACCESSIBLE

#78BE20

C. Yes
ACCESSIBLE

#858370

D. Yes
ACCESSIBLE

#008739

E. No
NOT ACCESSIBLE

#FFCD00

F. Yes
ACCESSIBLE

#004833

G. Yes
ACCESSIBLE

#858370

Reserved Colours

These are important contextual colours used throughout the interface. Do not use these colours for any other purpose than shown here. All these colours are accessible. Do not use these colours for any other purpose than shown here.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

3.0.0

Primary UI Palette

These are the nine core colours used in the digital brand. It’s important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

E
Heading

#004833

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

The secondary palette is a collection of bespoke, brand specific colours. Unlike the primary palette secondary colours do not map to the other brands. Secondary colours are generally used for bespoke brand embellishment: headers, promos, charts, diagrams etc. They are unique to the brand and must not be used anywhere else.

Sky

#3FC3EB

Plum

#502D79

Amber

#FF7F29

St.George Yellow

#FFCD00

Access Green

#008739

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A
Primary - Link / White

Accessible

B
Hero / White

Not accessible

C
Neutral / White

Accessible

E
Heading / White

Accessible

F
Text / White

Accessible

G
Muted / White

Accessible

Reserved Colours

The reserved colours convey meaning through colour. They’re used for contextual messaging and designed to clearly separate messaging from content. They must only be used in the alert and messaging components. Using the reserved colours for any other purpose or in any other interface element is off brand.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000

3.0.1

Primary UI Palette

These are the nine core colours used in the digital brand. It’s important to use these colours correctly for their specified purpose.

A
Primary - Link

#E30000

B
Hero

#78BE20

C
Neutral

#757463

E
Heading

#004833

F
Text

#004833

G
Muted

#757463

H
Border

#D6D5D0

I
Background

#F1F1EF

J
Light

#F8F8F7

Secondary Palette

The secondary palette is a collection of bespoke, brand specific colours. Unlike the primary palette secondary colours do not map to the other brands. Secondary colours are generally used for bespoke brand embellishment: headers, promos, charts, diagrams etc. They are unique to the brand and must not be used anywhere else.

Sky

#3FC3EB

Plum

#502D79

Amber

#FF7F29

St.George Yellow

#FFCD00

Access Green

#048938

Accessibility

This is a quick and dirty accessibility guide. The Westpac group have committed to comply with WCAG2 AA standards. Certain colours used in palette have to be accessible. Ignore at your peril.

A
Primary - Link / White

Accessible

B
Hero / White

Not accessible

C
Neutral / White

Accessible

E
Heading / White

Accessible

F
Text / White

Accessible

G
Muted / White

Accessible

Reserved Colours

The reserved colours convey meaning through colour. They’re used for contextual messaging and designed to clearly separate messaging from content. They must only be used in the alert and messaging components. Using the reserved colours for any other purpose or in any other interface element is off brand.

Success

#008000

Information

#0074C4

Warning

#C53B00

Danger

#C40000