# CloudPulse Brand Guidelines

## Brand Overview

**Product:** CloudPulse
**Tagline:** Monitor smarter, respond faster.
**Category:** Cloud Monitoring SaaS Platform

## Voice & Tone

### Voice Characteristics

- **Confident:** Speak with authority about cloud monitoring. Avoid hedging language.
- **Clear:** Use plain, direct language. No jargon without context.
- **Professional:** Maintain a polished, enterprise-ready tone.
- **Action-oriented:** Emphasize outcomes and results, not features alone.

### Tone Rules

1. Never use filler words: very, really, just, basically, actually, simply, literally, quite, rather.
2. No exclamation marks in marketing copy.
3. Use active voice over passive voice.
4. Keep sentences concise — aim for 15-20 words maximum.
5. Address the reader directly with "you" and "your."
6. Focus on benefits before features.

### Naming Conventions

- Always write the product name as **CloudPulse** (one word, capital C and P).
- Never write: Cloud Pulse, cloud pulse, CLOUDPULSE, cloudpulse.
- When referencing the platform, use "CloudPulse" or "the CloudPulse platform."

## Color Palette

| Role      | Hex     | Usage                                       |
| --------- | ------- | ------------------------------------------- |
| Primary   | #2563EB | CTAs, primary buttons, key links, accents   |
| Secondary | #7C3AED | Gradients, secondary highlights, badges     |
| Accent    | #10B981 | Success states, uptime indicators, checks   |
| Dark      | #1E293B | Headings, body text, dark backgrounds       |
| Light     | #F8FAFC | Page background, card backgrounds, sections |

### Color Rules

- Use only brand palette colors plus neutral grays (equal R, G, B values).
- Primary blue is the dominant action color.
- Secondary purple pairs with primary for gradient effects.
- Accent green signals positive states (uptime, success, growth).
- Dark is for text and dark section backgrounds.
- Light is the default page background.
- Do not introduce off-palette colors.
- Use 6-digit hex codes only (no 3-digit shorthand).

## Typography

### Font Stack

- Use system fonts: `-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`
- Monospace for code/metrics: `"SF Mono", "Fira Code", "Courier New", monospace`

### Scale

- H1: 3rem / bold — page hero only (one per page)
- H2: 2rem / bold — section headings
- H3: 1.25rem / semibold — subsection headings
- Body: 1rem / regular
- Small: 0.875rem / regular

### Heading Rules

- All headings must use Title Case (capitalize first letter of major words; lowercase minor words like a, an, the, and, but, or, for, nor, in, on, at, to, by, of, with, is, it, as).
- Only one H1 per page.
- Maintain heading hierarchy (no skipping levels).

## Imagery

- No external images or `<img>` tags.
- Use CSS shapes, gradients, and SVG inline graphics for visual elements.
- Use emoji or Unicode symbols sparingly for icons.

## Accessibility

- Set `lang="en"` on the HTML element.
- Use semantic HTML elements (nav, main, footer, section, article).
- Ensure sufficient color contrast (4.5:1 minimum for text).
- Add ARIA labels where semantic meaning is insufficient.
- Maintain logical heading hierarchy.
