Partner Resources

Branding Guidelines

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

Logo assets

Our master artwork ships in black so you can tint it for any surface. Inline the SVGs and apply currentColor to match blue or green palettes without exporting variants.

Preview treatments

Toggle between the solid fill and official gradients 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 gradients

The PDF mandates two gradients: purple→blue for Rawkode and teal→green for Rawkode Academy, both running on a 45° angle from top-left to bottom-right. Use these for hero panels, gradient logos, and any glowing dividers.

45° sweep

Rawkode Academy Gradient

#04B59C
#85FF95

Academy visuals run from teal into green (page 8), mirrored across hero cards and merch.

Use when the Academy is the lead brand story: curriculum launches, learning hub surfaces, etc.

45° sweep

Rawkode Core Gradient

#5F5ED7
#00CEFF

Primary Rawkode lockups transition from purple into blue as documented in the PDF (page 5).

Keep for Rawkode logos, backdrops, and partner lockups tied to the core company brand.

Core color palettes

Rawkode runs two first-class themes. Use the Green theme by default and switch to the Blue theme when a partner already leans blue. Partners must stick to one of these two treatments — no custom palettes.

Default

Rawkode Green Theme

Everyday Rawkode Academy brand moments — content, docs, livestreams, and merch.

Teal
#04B59C

Primary actions & hero gradients

Green
#85FF95

Glow accents & CTA outlines

Black
#23282D

Typography & surfaces

System

Rawkode Blue Theme

Use when we co-brand with developer tooling or infra partners who lean blue.

Purple
#5F5ED7

Primary headlines & hero sweeps

Blue
#00CEFF

Buttons, inputs, status

Black
#23282D

Depth, borders, typography

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: #6B46FF;
  --brand-on-surface: #23282D; /* base black */
}

/* 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.