Baufest Brand Guidelines

Overview

Color Palette

Primary Colors

#000000

#FF02AD

#AFFF00

#FFFFFF

Extended Neutrals

#1A1A1A

#4A4A4A

#E5E5E5

#F5F5F5

Color Application Rules

1. Dark-first: Default to dark backgrounds (

   #000000

   or

   #1A1A1A

   ) with light text. Baufest's identity is bold and high-contrast.
2. Magenta for emphasis: Use

   #FF02AD

   for the single most important element on any page — a CTA, a key metric, or a highlight. Never use magenta for body text.
3. Neon green sparingly:

   #AFFF00

   is a secondary accent. Use for tags, badges, success indicators, or to create energy in data visualizations. Avoid large blocks of neon green.
4. Contrast ratios: Ensure WCAG AA compliance. White text on black passes. Magenta on black passes. Neon green on black passes. Magenta on white fails — use black text with magenta accents instead.
5. No gradients between brand colors unless explicitly approved. Flat color blocks are the default.

Typography

Font Stack

Typography Rules

1. Headings: Barlow Semicondensed, uppercase for H1 only. Sentence case for H2–H4. Tracking: +0.02em for headings.
2. Body text: Montserrat Regular (400) at 16px base. Line height 1.5. Paragraph spacing 1em.
3. Emphasis: Use Montserrat Medium (500) for inline emphasis rather than italic. Reserve bold (700) for critical callouts.
4. Size scale: 14 / 16 / 18 / 24 / 32 / 48px. Do not use sizes outside this scale without justification.

CSS Variables (for application theming)

:root {
  /* Colors */
  --bf-black: #000000;
  --bf-magenta: #FF02AD;
  --bf-green: #AFFF00;
  --bf-white: #FFFFFF;
  --bf-dark-gray: #1A1A1A;
  --bf-mid-gray: #4A4A4A;
  --bf-light-gray: #E5E5E5;
  --bf-off-white: #F5F5F5;

  /* Typography */
  --bf-font-heading: 'Barlow Semicondensed', 'Arial Narrow', sans-serif;
  --bf-font-body: 'Montserrat', Arial, Helvetica, sans-serif;
  --bf-font-mono: 'JetBrains Mono', Consolas, monospace;

  /* Spacing */
  --bf-space-xs: 4px;
  --bf-space-sm: 8px;
  --bf-space-md: 16px;
  --bf-space-lg: 32px;
  --bf-space-xl: 64px;
}

Voice & Tone

Core Attributes

1. Precise: State facts directly. Avoid hedging ("we believe", "we think"). Lead with the conclusion, then support it.
2. Confident: Use active voice. "We will deliver" not "It is expected that delivery will occur." Avoid qualifiers unless uncertainty is genuine.
3. Forward-looking: Frame everything in terms of what comes next, not what happened. "The next milestone is..." not "We completed...". Progress is assumed; direction is what matters.
4. Technical but accessible: Baufest teams are technical. Use precise terminology. But when writing for executives or mixed audiences, define terms on first use.

Tone Calibration by Context

Writing Rules

1. No passive voice in headlines, subject lines, or opening sentences.
2. Quantify wherever possible. "Reduced latency by 40%" not "significantly improved performance."
3. One idea per paragraph. Short paragraphs. Generous whitespace.
4. Bullet points for lists of 3+ items. No walls of text.
5. No jargon without definition when audience includes non-engineers.

Applying the Brand

1. Documents (Markdown/HTML): Apply the color palette, font stack, and voice guidelines. Use dark headers with magenta accents. Structure with clear hierarchy.
2. Presentations: Black backgrounds, white text, magenta for emphasis. One idea per slide. Barlow Semicondensed for titles.
3. Code/Applications: Use the CSS variables above. Dark theme default. Magenta for interactive elements.
4. Emails/Messages: Concise. Forward-looking subject lines. Magenta only for key CTAs.
5. Data Visualizations: Black background, magenta for primary series, neon green for secondary, white for labels. No more than 4 colors per chart.