Partner Resources

Branding Guidelines

Our brand assets, color system, and recommended usage for partners

View Assets

Logo assets

Our master artwork ships in black so you can tint it for any surface. Inline the SVGs and apply currentColor to match the Rawkode Blue palette without exporting variants.

Preview treatments

Toggle between the solid fill and the official Rawkode Blue gradient to see how the lockups glow when you tint them.

Monogram

Use for avatars, favicons, stickers, or anywhere the brand needs to fit in a square. Keep plenty of breathing room so the M shape stays crisp.

  • Avatars & profile badges
  • Social icons
  • Overlays on content

Icon

Square logo built for UI chrome, app tiles, or partner lockups that need a bold geometric mark.

  • Product UI
  • Square partner placements
  • Small merch runs

Wordmark

Full logotype for hero sections, brochures, and anywhere legibility is critical. Only scale proportionally; never stretch.

  • Headers & banners
  • Email signatures
  • Printed materials

Official gradient

The Rawkode Blue gradient runs purple into cyan on a 135° sweep, top-left to bottom-right. Use it for hero panels, gradient logos, button gradients, and any glowing dividers.

135° sweep

Rawkode Blue Gradient

#5F5ED7
#00CEFF

The canonical brand gradient. Purple into cyan on a 135° sweep, top-left to bottom-right. Used across hero washes, logo lockups, and CTAs.

Use for any Rawkode lockup, hero panel, button gradient, or partner co-brand surface.

Core color palette

Rawkode has a single canonical brand identity: Rawkode Blue. All Rawkode properties (website, content, livestreams, merch, partner co-brands) use this palette. Partners must stick to this treatment, no custom palettes.

Canonical

Rawkode Blue

The single brand identity for Rawkode and Rawkode Academy. Used across every Rawkode property: website, content, livestreams, merch, and partner lockups.

Purple
#5F5ED7

Primary actions, headlines, brand-primary surfaces

Cyan
#00CEFF

Secondary highlights, CTA gradients, status glows

Dark Blue-Gray
#111827

Typography on light, deep backgrounds in dark mode

How to theme our black SVGs

We keep only the black source file in the repo and theme it with CSS. Inline SVGs work best; when using an <img/>, use filter or CSS masking if needed. Prefer the following approach for inline SVGs:

/* Define colors as variables */
:root {
  --brand-primary: #5F5ED7;   /* Rawkode Blue, purple */
  --brand-secondary: #00CEFF; /* Rawkode Blue, cyan */
  --brand-on-surface: #111827; /* deep blue-gray */
}

/* Inline svg -- set svg children to currentColor */
.brand-logo svg * {
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Usage: tint the svg by setting color */
.brand-logo--primary { color: var(--brand-primary); }
.brand-logo--dark { color: var(--brand-on-surface); }

Clearspace and sizing: rules

  • Always maintain a minimum clearspace equal to the height of the monogram on all sides.
  • Do not place the wordmark on low-contrast or busy patterns.
  • For co-branding, use the black monogram with a white stroke on dark backgrounds or the black mark on light backgrounds.