51污漫

Careers

51污漫 Brand

51污漫 colour palette

Use these colour values to maintain a consistent 51污漫 brand across digital, web, and print applications.

Primary brand colours

A palette of green tones and mushroom grounds the brand in the Fraser Valley.

Deep Green

Digital/web

HEX #17382b

RGB 23 / 56 / 43

Print

CMYK 88 / 24 / 66 / 74

PMS 3308 C

Lichen Green

Digital/web

HEX #bdefdd

RGB 189 / 239 / 221

Print

CMYK 24 / 0 / 11 / 0

PMS 573 C

Mushroom

Digital/web

HEX #f6f4ea

RGB 246 / 244 / 234

Print

CMYK 3 / 3 / 6 / 2

PMS 9080 C, Pastels & Neons

Leaf Green

Digital/web

HEX #00a055

RGB 0 / 160 / 85

Print

CMYK 79 / 0 / 91 / 0

PMS 2257 C

Secondary colour pops

Accent colours, inspired by our region, reflect the idea of sparking transformation — expressing our spirited, resourceful, inquisitive, and empowering personality.

Sun Yellow

Digital/web

HEX #ffe164

RGB 255 / 225 / 100

Print

CMYK 0 / 7 / 75 / 0

PMS 128 C

Fireweed Purple

Digital/web

HEX #ed9eff

RGB 237 / 158 / 255

Print

CMYK 10 / 43 / 0 / 0

PMS 251 C

Salmonberry Orange

Digital/web

HEX #ff8a65

RGB 255 / 138 / 101

Print

CMYK 0 / 53 / 55 / 0

PMS 1635 C

Valley Green

Digital/web

HEX #006d56

RGB 0 / 109 / 86

Print

CMYK 100 / 0 / 67 / 17

PMS 335 C

Colour science: CMYK vs RGB vs HEX vs Pantone

CMYK

For professional printing

CMYK stands for cyan, magenta, yellow, and black — the four inks used in most commercial and office printing. Use CMYK values for printed materials such as brochures, posters, reports, and stationery when Pantone spot colours are not being used.

Because CMYK colour is created with ink on paper, results can vary depending on the printer, paper stock, coatings, and printing method. Some bright RGB or Pantone colours cannot be reproduced exactly in CMYK. Colours appear darker in print than they do on screen.

RGB

For digital applications

RGB stands for red, green, and blue — the colours of light used to create colour on screens. Use RGB values for digital applications such as presentations, video, digital signage, and other screen-based materials.

RGB colours can appear brighter and more vibrant than their printed equivalents. Colour may vary from one screen to another depending on the device, display settings, and calibration.

HEX

For web and digital design

HEX is a six-character code used to specify RGB colours in websites and other digital applications. Use HEX values when building websites, emails, digital ads, or anywhere a hexadecimal colour value is required.

HEX and RGB describe the same screen-based colour in different formats, so they should produce equivalent results. As with all digital colour, appearance can vary between screens and devices.

Pantone

For precise print colour matching

The Pantone Matching System (PMS) uses standardized, premixed inks to provide consistent colour reproduction in professional printing. Use Pantone colours when accurate brand colour matching is especially important, such as for signage, merchandise, and other applications printed with spot inks.

Pantone offers the most controlled print reproduction, but colour can still shift depending on the paper stock, coating, and production process.

Working with colour

Examples

Primary colours dominate. Secondary colours support.

Feature 51污漫’s primary palette — our core greens and mushroom — to reinforce brand recognition. Use secondary colour pops as accents to add emphasis, energy, or contrast without overpowering the primary palette. Remember to take the colours in your photography into account when balancing colour

Use deep green prominently to create a rich, grounded, and recognizable application. Add secondary colours as accents for energy and emphasis. For longer or smaller areas of copy, use white or mushroom holding shapes for readability.

Use mushroom and white to create an open foundation for layouts with more content or longer copy. Use leaf and valley green for copy and headlines, with colour accents drawn from photography where appropriate.

In photography-forward layouts, use secondary colours as accents for graphic devices and points of emphasis. Keep 51污漫’s primary colours present through photography to maintain a recognizable connection to the brand.

Combining colours

The examples below show suggested colour combinations and how they can be proportioned across graphic and interior design applications.

The proportions shown are a guide, not an exact formula, and can be adapted to suit the space, application, and design needs.

Warm and versatile — mushroom-led

Use mushroom as the dominant colour for a warm, flexible foundation. Add leaf and deep green for contrast and structure, with white to keep the application feeling open.

Energetic and grounded — deep + leaf green

Use deep green and leaf green to combine energy with a strong, grounded presence. Add white or lichen green in smaller amounts for contrast and breathing room.

Fresh and confident— lichen-led

Use lichen green prominently for a light, fresh foundation. Balance it with deep green for contrast and add leaf green in a smaller proportion for energy.

Bold and expressive— deep green-led

Use deep green prominently for a strong, grounded foundation. Add leaf green and a secondary colour, such as fireweed purple, in smaller proportions to introduce energy and personality.

Thoughtful and curious — deep green-led

Use deep green prominently for a strong, grounded foundation. Pair it with mushroom and introduce a secondary colour, such as sun yellow, as a bold point of emphasis.

Bright and energetic — white-led

Use white prominently to create a bright, open foundation. Add primary greens for structure and contrast, with a secondary colour, such as salmonberry orange, for a lively accent.

Things to avoid

Here are some additional tips on working with our brand palette.

Avoid using black
for headlines

Instead, use deep green.

Avoid using white
text on our pops of
colour

Use deep green against secondary colours to meet accessibility contrast requirements.

Avoid using jarring
colours together

Secondary colour pops should not touch or overlap. 51污漫 logos and acronyms should never be used on them.

Avoid using pops of
colour as full floods

Our secondary colour pops should be used in our graphic device shapes, headlines, accents, and in photography.

Avoid small leaf green text on deep green

Avoid small deep green text on leaf green

The leaf green-deep green combination does not meet the minimum contrast requirement for small text.

Avoid using black
for backgrounds

Instead, use deep green or mushroom from the palette.

Avoid using colour
pops on mushroom
or white

This doesn’t follow accessibility guidelines.
Use deep green, leaf green, or valley green.

Avoid using valley
green as a full flood

Use valley green for supporting copy, including headlines and subheads, for a green tone that passes accessibility standards. It isn’t intended for large colour floods.

Avoid using
too many
colours together

Especially the colours outside of deep green, leaf green, and mushroom.

Accessible colour combinations

51污漫's web standards call for us to meet or exceed WCAG 2.2 AA accessibility colour contrast ratios.

WCAG 2.2 level AA requires the following minimum contrast ratios:

4.5 to 1 for normal text ( smaller than18.66 px)
3 to 1 for large text (24 px or 18.66 px bold and larger)
3 to 1 for graphics and UI components

Okay to use on a white background (#fff)

Large text
(24 px or bigger)

Deep Green #17382b

Valley Green #006d56

Leaf Green #00a055

Charcoal #333

Black #000

Large text, bold
(19 px or bigger)

Deep Green #17382b

Valley Green #006d56

Leaf Green #00a055

Charcoal #333

Black #000

Normal text
(18 px or smaller)

Deep Green #17382b

Valley Green #006d56

Charcoal #333

Black #000

Okay to use on mushroom background (#f6f4ea)

Large text
(24 px or bigger)

Deep Green #17382b

Valley Green #006d56

Leaf Green #00a055

Charcoal #333

Black #000

Large text, bold
(19 px or bigger)

Deep Green #17382b

Valley Green #006d56

Leaf Green #00a055

Charcoal #333

Black #000

Normal text
(18 px or smaller)

Deep Green #17382b

Valley Green #006d56

Charcoal #333

Black #000

Okay to use on lichen green background (#bdefdd)

Large text
(24 px or bigger)

Deep Green #17382b

Valley Green #006d56

Charcoal #333

Black #000

Large text, bold
(19 px or bigger)

Deep Green #17382b

Valley Green #006d56

Charcoal #333

Black #000

Normal text
(18 px or smaller)

Deep Green #17382b

Charcoal #333

Black #000

Okay to use on deep green background (#17382b)

Large text
(24 px or bigger)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Leaf Green #00a055

Salmonberry Orange #ff8a65

Fireweed Purple #ed9eff

Large text, bold
(19 px or bigger)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Leaf Green #00a055

Salmonberry Orange #ff8a65

Fireweed Purple #ed9eff

Normal text
(18 px or smaller)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Okay to use on valley green background (#006d56)

Large text
(24 px or bigger)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Large text, bold
(19 px or bigger)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Normal text
(18 px or smaller)

White #fff

Mushroom #f6f4ea

Lichen Green #bdefdd

Sun Yellow #ffe164

Okay to use on leaf green background (#00a055)

Large text
(24 px or bigger)

White #fff

Mushroom #f6f4ea

Deep Green #17382b

Large text, bold
(19 px or bigger)

White #fff

Mushroom #f6f4ea

Deep Green #17382b

Normal text
(18 px or smaller)

Black #000

Okay to use on sun yellow background (#ffe164)

Large text
(24 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Large text, bold
(19 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Normal text
(18 px or smaller)

Black #000

Charcoal #333

Deep Green #17382b

Okay to use on fireweed purple background (#ed9eff)

Large text
(24 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Large text, bold
(19 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Normal text
(18 px or smaller)

Black #000

Charcoal #333

Deep Green #17382b

Okay to use on salmonberry orange background (#ff8a65)

Large text
(24 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Large text, bold
(20 px or bigger)

Black #000

Charcoal #333

Deep Green #17382b

Normal text
(18 px or smaller)

Black #000

Charcoal #333

Deep Green #17382b

Brand Guidelines

Our Brand Guidelines PDF includes more detailed info about using the 51污漫 colour palette.

Download the brand guidelines [PDF 10mb]

Contact Us