Brand Guidelines
Buzz Cybersecurity Brand Kit
Cybersecurity-first managed IT for Southern California businesses. Trustworthy, calm, and built to run on-brand across every ad, deck, and printed page without a single guess.
01 · Logo
The mark
The shield-and-hexagon icon carries the honey accent stroke; the wordmark is set in Public Sans Black. Use the color version on light surfaces and the white knockout on dark surfaces. Never separate the icon from the wordmark.
Primary · on white / paper
Reverse · on ink / navy
Clear space: keep an empty margin equal to the height of the shield icon on every side. Nothing (text, edges, photos, other logos) enters that zone.
Minimum size
- Digital: 100px wide minimum for the full lockup (icon + wordmark)
- Print: 1 inch wide minimum for the full lockup
- Icon alone (favicon, app tile, social avatar): 24px minimum
- Below these sizes, use the icon alone, not a shrunk wordmark
Do not
- Stretch, squash, or rotate the lockup
- Recolor the mark outside the approved palette
- Place the color mark on a busy photo without a solid or dark scrim behind it
- Add drop shadows, outlines, or bevels to the logo itself
Stretched
Off-palette recolor
On a busy image, no scrim
02 · Color
Palette
Ink is the authority surface: hero, footer, reviews, night-watch sections. Honey is the single action color, reserved for CTAs, icon fills, and the hexagon accent. Never set honey as small body text on white; use honey-text instead for AA contrast.
RGB 8, 20, 32
CMYK 75, 38, 0, 87
RGB 13, 31, 48
CMYK 73, 35, 0, 81
RGB 18, 41, 61
CMYK 70, 33, 0, 76
RGB 15, 34, 51
CMYK 71, 33, 0, 80
RGB 247, 148, 29
CMYK 0, 40, 88, 3
RGB 217, 122, 8
CMYK 0, 44, 96, 15
RGB 255, 180, 84
CMYK 0, 29, 67, 0
RGB 163, 83, 0
CMYK 0, 49, 100, 36
RGB 255, 255, 255
CMYK 0, 0, 0, 0
RGB 243, 246, 249
CMYK 2, 1, 0, 2
RGB 228, 234, 241
CMYK 5, 3, 0, 5
RGB 34, 48, 60
CMYK 43, 20, 0, 76
RGB 91, 107, 122
CMYK 23, 11, 0, 52
RGB 52, 211, 153
CMYK 75, 0, 27, 17
RGB 26, 15, 0
CMYK 0, 42, 100, 90
03 · Typography
Public Sans, top to bottom
One typeface family does every job: display headlines, body copy, buttons, and the mono-style micro-labels (set at true monospace, not Public Sans, for that console texture). Weights loaded: 400, 500, 600, 700, 800, 900.
| Element | Size | Weight | Line height | Letter spacing | Example |
|---|---|---|---|---|---|
| H1 | 32–50px (fluid) | 800 | 1.08 | −0.025em | Managed IT, done right |
| H2 | 26–38px (fluid) | 700 | 1.16 | −0.015em | Why businesses choose Buzz |
| H3 | 20px | 700 | 1.16 | −0.015em | 24/7 monitoring |
| H4 | 17px | 700 | 1.16 | −0.015em | Fast response |
| Body | 16px | 400 | 1.68 | normal | Buzz runs your technology and your defenses as one job. |
| Body large | 17px | 400 | 1.75 | normal | Used for hero subheads and section intros |
| Small / caption | 13.5–14.5px | 400 | 1.6–1.65 | normal | Card descriptions, footnotes |
| Button label | 14–15.5px | 700 | 1 | 0.005em | Get Your Free Assessment |
| Mono micro-label | 10.5–11.5px | 600–700 | 1 | 0.16–0.22em | Ops Console Label |
04 · The Hexagon Motif
The recurring signature
The hexagon is Buzz's shorthand for "watched and protected." It shows up as an icon chip, a step number, a bullet mark, and a social badge shape. Use it to mark something important, never as pure decoration stacked more than once per component.
Icon chip
Service cards, industry cards, footer social icons
Step number
Numbered process timelines
Eyebrow bullet
Precedes every mono micro-label
List marker
Replaces bullet points in feature lists
05 · Voice
How Buzz sounds
Trustworthy, calm, clear, plain-English, confident. Cybersecurity-aware without fearmongering. Local and relationship-driven. Practical over technical, direct about business risk, reassuring about peace of mind.
Do
Plain, declarative sentences. Say what Buzz does and what it means for the reader's business. Lead with the outcome (uptime, protection, response speed), not the technology.
Don't
No jargon, no scare tactics, no unsupported guarantees, no generic "we're the best" copy. No em-dashes anywhere: use commas, periods, colons, or parentheses instead.
Avoid AI-tells
Skip "not just X, it's Y," filler triads, and phrases like "in today's digital landscape." If a sentence reads like it came out of a template, rewrite it plainer.
Naming
Say "Free Assessment", not "free assessment." Say "24/7 monitoring", not "round-the-clock surveillance." Keep offer names consistent across every asset.
06 · Photography
Real people, real offices
Photography should feel like proof, not stock. Buzz's edge is founder-led trust and a real local team; the imagery has to carry that.
Use
- Real Buzz team members and offices (Irvine and Corona)
- Warm, candid, natural light over staged studio lighting
- People actually working: monitoring screens, collaborating, on client calls
- Environments that read as small-business SoCal, not corporate stock parks
Avoid
- Hoodie-and-hacker cliches, ski masks, disembodied hands on keyboards
- Green Matrix-style falling code or glowing padlock stock art
- Generic stock photo people who clearly aren't Buzz staff
- Overly futuristic sci-fi security dashboards that don't resemble real tools
07 · Quick-Use Tokens
For developers and designers
Copy the CSS variables straight into any build. For Canva, Figma, or ad tools that need plain hex codes, use the table below: the six core colors and two font families that carry the brand.
| Token | Hex | Use for |
|---|---|---|
| Ink | #081420 | Dark backgrounds, headers, footers |
| Navy | #0F2233 | Headline text on light backgrounds |
| Honey | #F7941D | Buttons, icons, the hexagon accent |
| Amber | #FFB454 | Highlights and gradients on dark backgrounds |
| Paper | #FFFFFF | Page background, cards |
| Mist | #F3F6F9 | Section backgrounds, soft panels |
| Fonts: Public Sans (headlines & body) · system monospace (labels & eyebrows) | ||