CV Ripper — Brand Style Guide

Colour Palette

Brand Colours

Five core colours define the CV Ripper visual identity. Use them consistently across all touchpoints.

Deep Teal

Primary brand colour

HEX#063444

RGB6, 52, 68

Dark backgrounds, headers, navigation

Ice Blue

Light backgrounds

HEX#d9ecfa

RGB217, 236, 250

Cards, content areas, subtle fills

Amber Gold

Accent colour

HEX#faaf30

RGB250, 175, 48

CTAs, highlights, interactive elements

Sky Blue

Secondary colour

HEX#92c6eb

RGB146, 198, 235

Borders, icons, supporting UI

Midnight Teal

Deep variant

HEX#002a3a

RGB0, 42, 58

Footer, overlays, contrast backgrounds

Colour Usage Guidelines

Deep Teal is the primary brand colour. Use for headers, navigation bars, and dark backgrounds. Pair with white or Ice Blue text for contrast.

Amber Gold is the accent. Reserve for calls-to-action, active states, and key highlights. Avoid overuse — its impact comes from scarcity.

Ice Blue creates breathing room. Use for light section backgrounds, card fills, and content containers against white.

Sky Blue is the workhorse secondary. Use for borders, subtle icons, footer text, and supporting UI elements.

Typography

Roboto Font Family

Roboto is the sole typeface for all CV Ripper communications — web, print, and product.

Weights

Roboto Regular 400

Roboto Medium 500

Roboto Bold 700

Scale

H1 — 3rem / Bold

Page Headings

H2 — 1.875rem / Bold

Section Titles

H3 — 1.25rem / Semi Bold

Sub-Sections

Body — 1rem / Regular

Standard body copy for paragraphs and descriptions.

Source

Roboto is loaded from Google Fonts with the weights 400, 500, and 700.

<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">

Logo Assets

Logo Gallery

All official logo variants with dimensions and recommended usage contexts.

Primary Logos (Square)

Primary Logo

500 × 500

Primary logo for large displays, presentations, and print.

CV-Ripper-Shutterstock-Logo-500.png

Medium Logo

250 × 250

Medium logo for websites and documents.

CV-Ripper-Shutterstock-Logo-250.png

Small Logo

100 × 100

Small logo for email signatures and compact layouts.

CV-Ripper-Shutterstock-Logo-100.png

Favicon & Icon Variants

App Icon

64 × 64

App icon, large favicon.

CV-Ripper-Shutterstock-Logo-64.png

Standard Favicon

32 × 32

Standard browser favicon.

CV-Ripper-Shutterstock-Logo-32.png

Small Favicon

16 × 16

Small favicon for tab bars.

CV-Ripper-Shutterstock-Logo-16.png

Icon-Only Variant

Icon Only (No Text)

32 × 32

Icon-only variant without wordmark. Use where space is limited.

CV-Ripper-Shutterstock-Icon-32.png

Layout Variants

Horizontal / Landscape

1024 × 230

Wide layout for headers, marketing banners, and email footers.

CV-Ripper-Shutterstock-Horizontal-1024.png

Vertical / Stacked

900 × 900

Stacked layout for social media profiles, print materials, and square placements.

CV-Ripper-Shutterstock-Vertical-900.png

Usage Guidelines

Do's & Don'ts

Follow these rules to maintain brand consistency across every touchpoint.

Do

Use the horizontal logo in headers and email banners
Use the square logo for social media profile pictures
Maintain clear space equal to the logo height around all sides
Place logos on Deep Teal, white, or Ice Blue backgrounds
Use Amber Gold sparingly — only for CTAs and key highlights
Always use Roboto as the typeface in all materials

Don't

Don't stretch, rotate, or distort the logo in any way
Don't place the logo on busy, patterned, or photographic backgrounds
Don't alter the logo colours or apply effects (gradients, shadows, glows)
Don't use the logo smaller than 16 × 16 px
Don't substitute Roboto with other typefaces in branded materials
Don't use Amber Gold as a background colour for large areas

Logo on Backgrounds

On Deep Teal

On White

On Ice Blue