RAZE Action — Brand Style Guide

01 — Logo

The RAZE Action Mark

The RAZE Action wordmark is the primary brand asset. It consists of the heavy-weight "RAZE" logotype, the "ACTION" sub-label, and the signature diagonal red slash — a single unified system that should never be altered or separated.

01.0 — NON-NEGOTIABLE

The wordmark is artwork, not type

The mark is a fixed piece of drawn artwork. It is always placed from the supplied logo files. It is never re-set, re-typed, re-traced or rebuilt in any typeface — including Anton, and including at the sizes where "close enough" would pass.

The typefaces in section 03 govern typeset copy around the mark — headlines, fighter names, labels, body. They do not describe the letterforms inside the mark, which belong to the artwork and to nothing else. If a layout needs the wordmark at a new size or colourway, scale or recolour the supplied file; if the file you need does not exist, request it rather than approximating it.

01.1 — Approved Colourways

Primary · White on Black

Secondary · White on Dark Grey

Reversed · Black on White

Inverted · White on RAZE Red

01.1a — MASTER LOGO FILES

Transparent, no containing box

All logo placement now uses the transparent PNG masters. The wordmark sits on a fully transparent background with no black or white box, so it drops onto any colour, photograph or video frame cleanly. The red slash is fixed at #E8112D in every file. Choose the colourway by background luminance, never by re-colouring the artwork.

          White wordmark — dark backgrounds

          RAZE_ACTION_logo_white_noBox_HQ.png · 1860×1138

          RAZE_ACTION_logo_white_noBox.png · 930×569
        
          Black wordmark — light backgrounds

          RAZE_ACTION_logo_black_noBox_HQ.png · 1860×1138

          RAZE_ACTION_logo_black_noBox.png · 930×569

Use the HQ file wherever the mark is placed above 400px wide or in print. Never place the white file on a light background, and never sit either file on a solid panel to force contrast — move it to a darker or lighter area of the frame instead.

01.2 — Logo Variants

Stacked Lockup (default)

Wide / Banner Lockup · transparent no-box master

01.3 — Exclusion Zone

× Height × Height × Height × Height

Minimum clear space on all four sides equals the cap-height of the letter "R" in the wordmark. Never allow other graphic elements inside this boundary.

The exclusion zone is the protected area around the logo. It is defined as 1× the cap-height of the "R" on all sides for the stacked mark, and 1× the cap-height top and bottom, 0.5× cap-height left and right for the wide banner mark.

This space must always be free of text, imagery, and other graphic elements — including other logos, borders, or decorative devices.

01.4 — Minimum Size

Digital min · 120px wide

Print min · 25mm wide

02 — Colour

Colour Palette

The RAZE Action palette is built on high contrast and restraint — near-black, white, and one bold accent. The red is the brand's single expressive tool; use it with intent, never decoration.

RAZE Red

HEX #e8112d RGB 232 · 17 · 45 Rules, slashes, nicknames, LIVE PPV

Ground Black

HEX #08080a RGB 8 · 8 · 10 Bars, cards, primary background

Panel Black

HEX #141417 RGB 20 · 20 · 23 Secondary slash, panel surfaces

Primary Type

HEX #ffffff RGB 255 · 255 · 255 Headlines, primary text

Secondary Type

HEX #c9c9d0 RGB 201 · 201 · 208 Sublines

Tertiary Type / Muted

HEX #8d8d94 RGB 141 · 141 · 148 Meta text, handles, record lines

Event Accent (Teal)

HEX #7ed6cf RGB 126 · 214 · 207 Per-event only — borrowed from promoter key art, use sparingly

Border

HEX #2A2A2E RGB 42 · 42 · 46 Dividers, outlines

02.1 — Contrast Ratios (WCAG 2.1)

Foreground	Background	Ratio	AA Normal	AA Large	AAA
Primary Type	Ground Black	20.0 : 1	PASS	PASS	PASS
Primary Type	RAZE Red	4.6 : 1	PASS	PASS	FAIL
RAZE Red	Ground Black	4.3 : 1	FAIL	PASS	FAIL
Tertiary / Muted	Ground Black	6.1 : 1	PASS	PASS	FAIL
Secondary Type	Ground Black	12.2 : 1	PASS	PASS	PASS
Ground Black	Primary Type	20.0 : 1	PASS	PASS	PASS

02.2 — Colour Usage Rules

RAZE Red is an accent only — use for the slash, key CTAs, critical labels, and highlights. Never flood a layout with red.
Red text on Ground Black fails AA-normal contrast (4.3:1) — fine for large/display text (LIVE PPV, nicknames) but do not set body-size copy in red on black.
Default UI backgrounds are Black or Dark Surface. Reversed white-background applications are permitted for print collateral only.
Never use a mid-grey as a background — reserve grey tones for card surfaces and UI panels.
Do not introduce additional brand colours (no blue, green, purple, gold) without a full brand extension review.
Gradients using palette colours are permitted for background textures at low opacity (<10%) only.

03 — Typography

Type System

RAZE Action uses Anton for headlines, fighter names and key labels (LIVE PPV, RAZEACTION.COM) — but never for the wordmark itself, see 01, Barlow Condensed for sublines and records, JetBrains Mono for eyebrows, dates, handles and tabs — always tracked out, and Archivo for UI and body copy. All four are free Google Fonts.

CONTEXT A

Broadcast & Promo

Anton leads all typeset copy — but not the wordmark. Fighter names, event titles, LIVE PPV, RAZEACTION.COM. Barlow Condensed 600 carries sublines, records and city lines. JetBrains Mono, tracked to .28–.40em, carries eyebrows, dates, handles and tabs. Set at scale — nothing below 24px at 1080 wide.

CONTEXT B

Digital & Product

Barlow Condensed 900 leads display and headings; Archivo carries UI and body copy. Anton is reserved for hero moments and brand marks — it is a poster voice and becomes heavy-handed across a full interface. Mono keeps its tracked-out label role.

One palette, one family set, two contexts. The specimens below are set in the face each level uses in its primary context.

Hero Display Anton (promo) / Barlow Condensed 900 (product)
Display type only — not the wordmark
ALL CAPS
Tracking: −0.01em
Leading: 0.88

RAZE
Action

Display Anton
ALL CAPS · 2.8rem
Tracking: 0
Leading: 1.0

Live. Loud. Unfiltered.

Heading H1 Anton
ALL CAPS · 2rem
Tracking: +0.02em

World Class Action Sport

Heading H2 Anton
ALL CAPS · 1.4rem
Tracking: +0.06em

Upcoming Events & Fixtures

Subheading Barlow Condensed 600
ALL CAPS · 0.88rem
Tracking: +0.24em · Muted

On demand · Live · Pay-per-view

Body Copy Archivo Regular 400
Sentence case · 1rem
Leading: 1.72

RAZE Action is your home for world-class combat sports, extreme events, and live action programming — streamed direct to you, wherever you are.

Caption / Meta JetBrains Mono 500
ALL CAPS · 0.76rem
Tracking: +0.1em · Muted

Saturday 14 June 2026 · 20:00 BST · PPV Event

Label / Eyebrow JetBrains Mono 500
ALL CAPS · 0.68rem
Tracking: +0.3em · Red

Live Now

03.1 — Type Rules

Display and heading text is always All Caps. Body copy is sentence case.
Never set body copy in Anton or Barlow Condensed — Archivo is the only body font. Barlow Condensed is reserved for sublines/records; JetBrains Mono for tracked labels, dates and handles.
Do not use italic or oblique on display text. The red slash provides the angle; type stays upright.
Minimum body text size is 14px / 0.875rem for accessibility.
System fallbacks: system-ui, -apple-system, sans-serif.

04 — Slash Motif

The Red Slash

The diagonal red slash is RAZE Action's signature graphic device. It appears in the logo as a bold parallelogram cutting through the "Z/E" junction — conveying speed, impact, and forward momentum. It can be extended as a design element across all brand touchpoints.

Vertical divider

RAZE Action

Small inline divider

Live PPV VOD

Section header accent bar

Featured Events

Wordmark with slash in text

Watch It /
Own It

04.1 — Slash Rules

The slash always uses a -14° skew — matching the logo mark. Never use a vertical bar or horizontal rule as a substitute.
Slash colour is always RAZE Red (#e8112d). No other colour, except the per-event Teal accent (#7ed6cf) where the promoter key art calls for it.
The slash should never be used as pure decoration — it must serve a structural or semantic purpose (divide, accent, pace).
On white or light backgrounds, the slash retains its red colour at full opacity.

05 — Components

UI Components

Core UI building blocks — all derived directly from brand primitives. The clipped corner on buttons echoes the slash motif's diagonal cut.

Buttons

Badges & Pills

Live PPV VOD New Free

Content Card

Live Event · PPV

World Championship
Title Fight

Saturday 14 June · 20:00 BST — Stream live or replay on demand.

Section Header w/ Slash

Upcoming Events

Featured Fighters

Eyebrow + Title Pairing

On Demand

Full Fight
Replays

Available from £4.99

Slash Text Divider

MMA Boxing Kickboxing

06 — Tone of Voice

Brand Voice

RAZE Action speaks like someone who knows the sport from the inside. Confident, direct, never corporate. The writing style mirrors the visual identity: punchy, high-contrast, no filler.

We Are

Direct and confident
Energetic without being breathless
Knowledgeable — we respect the sport
Sharp, punchy sentences
Excited but not hyperbolic
Inclusive of the die-hard fan

We're Not

Corporate or buzzword-heavy
Breathlessly overexcited ("AMAZING!!!!")
Condescending to casual fans
Formal or stiff
Padding with filler words
Inconsistent in capitalization/style

06.1 — Copy Examples

✓ On Brand

"The belt is on the line. Watch every round, live and unfiltered."

"No filler. No fluff. Just the fight."

"Stream from £4.99. Cancel any time."

✕ Off Brand

"Welcome to our amazing platform where you can enjoy fantastic content!"

"Don't miss this INCREDIBLE EVENT!!!! 🔥🔥🔥"

"Please find herewith the details of our forthcoming broadcast."

07 — Motion & Animation

Motion Principles

Motion on RAZE Action should feel fast, purposeful, and impactful — never decorative or slow. Lead with the slash; cut don't fade. The system runs in two contexts: interface motion, and the broadcast promo language used on every event cut.

07.1 — Digital & Product Motion

Property	Value	Use Case
UI Micro-interaction	150ms ease-out	Button hover, badge state, link colour change
Panel / Drawer entry	220ms cubic-bezier(0.2, 0, 0.0, 1)	Menus, overlays, sidebars sliding in from edge
Content reveal	300ms ease-out	Cards loading in, hero text animating on scroll
Logo slash intro	400ms · slash cuts in first, then text fades	Brand intro / splash screen / ident opener
Exit / dismiss	120ms ease-in	Modals, toasts, notifications fading out
Transitions to avoid	Bounce, elastic, spin, slow fade (>500ms)	These feel soft and corporate — not RAZE

07.2 — Broadcast Motion: The Promo System

Every RAZE promo is assembled from the same parts in the same order. The timings below are not suggestions — they are what makes two cuts from two different events read as one channel.

Element	Timing	Behaviour
Logo ident	0 → 2.45s	Red slash drops in first (0.85s), black slash follows at +0.08s, mark wipes on at 0.45s, endline at 1.0s, strapline at 1.3s
Signature wipe	0.42s + 0.46s, 0.06s offset	Two −14° skewed panels — red leads, black follows. This is the only transition. Never a cross-fade
Full-screen card	2.0 – 4.5s	Always topped and tailed by a wipe. Also used deliberately to hide a jump cut when unusable footage is removed
Name plate / VS plate	4.5 – 5.5s	Rule wipes on (0.35s), headline clips up (0.5s at +0.1s), subline fades (0.5s at +0.45s). Plates enter from opposite sides — top fighter from left, bottom from right
Rule reveal	0.5s, origin left	scaleX 0 → 1, cubic-bezier(.16,1,.3,1). Every red rule animates; none simply appear
CTA bar	0.5s rise, holds to final wipe	Rises from the lower edge. Must be fully in place before the covered artwork appears — see section 08
End board	3.4s	Slow 1.07 → 1.0 push over the whole card. Mark, rule, date, URL, handle, staggered 0.1 / 0.5 / 0.6 / 0.8 / 1.1s
Audio	1.6s ramp out	Reel audio fades over the last 1.6s. Pull the ramp forward to drop a third-party name-check from a voice-over
Never	Bounce, elastic, spin, slow fade (>500ms)	Soft and corporate — not RAZE

07.3 — The Standard Cut Skeleton

Ident → wipe → footage with name plate → VS plate → event title card → venue card → date card → tagline → CTA bar over the promoter's end board → wipe → RAZE end board. Drop cards to shorten; never reorder them. A 15-second cut keeps ident, one plate, date and end board.

08 — Broadcast & Promo

Event Applications

RAZE Action carries other people's events. Almost every asset we receive arrives already branded by a promoter, a venue, a ticketing platform and a wall of sponsors. This section governs what we cover, what we keep, and how the two brands sit together.

08.1 — The CTA Bar

The CTA bar is the single most important brand element in an event promo. It is a solid #08080a band with a #e8112d top rule, carrying the mark, LIVE PPV, the date line, RAZEACTION.COM and the handle. It replaces third-party ticketing and sponsor logos at the base of supplied artwork.

Canvas	Bar height	Top edge
1080 × 1350 key art	206px	y1144
1920 × 1080 key art	150px	y930
2551 × 3579 print	466px (14px rule)	y3113
1080 × 1920 motion	530px stacked	mark over LIVE PPV over date
1920 × 1080 motion	234px	three columns

08.2 — Cover Rules

Cover ticketing and sponsor rows completely, including any drop shadow beneath them.
In motion, bring the bar up 0.4 to 0.6 seconds before the covered artwork fades up. Early is invisible; late is the one error a client always catches.
Leave the venue line above the bar clear — 20px on a 1350px canvas, 30px on 1080p. Measure the artwork; do not eyeball it.
Use one continuous bar when a lower-third strap and an end board follow each other. Do not exit and re-enter.
Keep the promoter's key art, fighters and event title intact. We cover commerce, not creative.

Never let a third-party ticketing logo appear, even for a few frames.
Never crop or letterbox the promoter's artwork to make the bar fit.
Never place the bar over a fighter's face or the event title.
Never leave a third-party ticketing name-check audible in a voice-over — ramp the audio before the word.
Never restate the date in two places on the same frame.

08.3 — Co-branding & Bugs

RAZE mark top left, promoter mark top right, both at reduced opacity (0.95 / 0.80). Both bugs drop out under full-screen cards, under the CTA bar and across the ident and end board. The promoter's mark never appears on the RAZE end board — that frame is ours alone.

08.4 — Delivery Sizes

Asset	Size	Notes
Social cut	1080 × 1920	Fighter hypes, training reels, interview cuts
Web cut	1920 × 1080	Event promos, long-form trailers
Key art	1080 × 1350 · 1920 × 1080	Feed and header
Print	2551 × 3579	Poster

Standard cut lengths: 15s and 30s for paid and social, 30–50s for fighter hypes, 90s+ for the full event trailer. Type never below 24px at 1080 wide.

09 — Spacing

Spacing Scale

An 8px base grid. All spacing uses multiples of 8. Generous negative space is part of the premium feel — resist the urge to fill every gap.

4px — Micro gap (badge padding, inner icon margin)

8px — Base unit (tight inline spacing)

16px — Default component padding

24px — Card internal padding

32px — Section sub-block gap

48px — Page horizontal padding (desktop)

64px — Section vertical padding (standard)

96px — Hero / cover section padding

10 — Logo Don'ts

What Not To Do

The logo must never be altered. These are the most common mistakes to avoid across all applications.

RAZE ACTION

Do not render the logo in grey or any colour other than the approved white/black/red colourways.

RAZE ACTION

Do not reduce the logo below 30% opacity or ghost it as a watermark on busy imagery.

RAZE ACTION

Do not add wide tracking to the wordmark — letter spacing is fixed as per the master artwork.

RAZE Action

Do not recreate the wordmark in a different typeface. Always use the approved logo files.

RAZE ACTION

Do not set the wordmark in Anton. Anton is the display face for headlines and labels; the mark is drawn artwork and is placed from file, never typed.

RAZE ACTION

Do not skew, stretch, condense, or transform the logo geometry in any way.

RAZE ACTION

Do not apply gradients, glows, drop shadows, or textures to the wordmark.

RAZE ACTION

Do not introduce non-brand colours — no blue, green, purple, gold, or tinted white variants.

RAZE ACTION

Do not place the logo directly on a complex photographic background without a solid backing panel or sufficient contrast.

RAZEAction

The RAZE Action Mark

The wordmark is artwork, not type

01.1 — Approved Colourways

Transparent, no containing box

01.2 — Logo Variants

01.3 — Exclusion Zone

01.4 — Minimum Size

Colour Palette

02.1 — Contrast Ratios (WCAG 2.1)

02.2 — Colour Usage Rules

Type System

Broadcast & Promo

Digital & Product

03.1 — Type Rules

The Red Slash

04.1 — Slash Rules

UI Components

Brand Voice

06.1 — Copy Examples

Motion Principles

07.1 — Digital & Product Motion

07.2 — Broadcast Motion: The Promo System

07.3 — The Standard Cut Skeleton

Event Applications

08.1 — The CTA Bar

08.2 — Cover Rules

08.3 — Co-branding & Bugs

08.4 — Delivery Sizes

Spacing Scale

What Not To Do

RAZE
Action