Bluewaves Brand Kit
Quick Reference
- Primary color: #B78A66 (brown sand)
- Accent 1: #00D2E0 (teal ocean) — use sparingly
- Accent 2: #FF375F (sun red) — use sparingly
- Body font: Merriweather (assets/fonts/body.ttf)
- Heading font: Merriweather Bold (assets/fonts/heading-bold.ttf)
- Page format: A4
- Text color: #2C2C2C (never pure black)
- Background: white
Assets
Use the manifest at assets/manifest.json as the programmatic entry point.
Fonts
Four roles: heading, body, mono. All TTF files in assets/fonts/.
| Role | Family | Weight | File |
|---|---|---|---|
| Heading | Merriweather | regular | heading.ttf |
| Heading | Merriweather | bold | heading-bold.ttf |
| Body | Merriweather | regular | body.ttf |
| Body | Merriweather | italic | body-italic.ttf |
| Body | Merriweather | bold | body-bold.ttf |
| Body | Merriweather | bold italic | body-bold-italic.ttf |
| Mono | Fira Code | regular | mono.ttf |
Logos
Variants: full lockup and mark, each in color and white. Files in assets/logos/. Use logo-full-color.svg as default.
| Variant | Color | White |
|---|---|---|
| Full lockup | logo-full-color.svg/.png | logo-full-white.svg/.png |
| Mark | logo-mark-color.svg/.png | logo-mark-white.svg/.png |
| Favicon | favicon.png (512x512) | — |
| Wordmark | wordmark.svg | — |
PDF Templates
Pre-designed pages in assets/templates/pdf/. Content placement defined in assets/templates/pdf/zones.json.
Select from templates: cover-front, cover-back, page-content, page-blank, section-divider, color-primary, color-accent.
Patterns
Find decorative assets in assets/patterns/: pattern-01.svg/.png, divider-line.svg.
Design Tokens
For full token definitions (color palette, type scale, spacing grid, shadows), see references/tokens.md.
Key Design Principles
- Merriweather for both headings (bold) and body (regular) — single-family harmony
- Brown sand primary carries the identity; teal and red accents used sparingly
- White backgrounds with warm neutral text (#2C2C2C)
- Apple-minimalist: clean font hierarchy, no decorators/lines, perfect typography and spacing
Imagery Guidelines
- Style: Fashion editorial — curated, magazine-cover quality
- Color treatment: Muted palette, Kodachrome film look
- Corner radius: 6pt
- Subjects: Landscapes or people, fashion editorial style, consistently beautiful
- Avoid: Oversaturated/neon colors, amateur-looking shots, inconsistent visual tone
- AI prompt prefix:
editorial photography, desaturated Kodachrome palette, cinematic composition, magazine-cover quality, muted tones, film grain, emotionally evocative
Chart Guidelines
- Primary palette: Brown sand (#B78A66), teal (#00D2E0), sun red (#FF375F), then semantic colors
- Sequential: Light-to-dark brown sand gradient (7 stops)
- Diverging: Sun red ↔ Teal through neutral (#F5F5F7)
- Highlight color: #FF375F (sun red) on #FFFFFF contrast
- Figure background: White (#FFFFFF)
- Charts use brand typography tokens (h3 for titles, body-sm for axis labels, caption for ticks/legends)
Usage with PDF Factory
- Pass this skill's directory path as
--brandto render.py and compose.py - Scripts read
assets/manifest.jsonfor fonts, logos, templates, and tokens - The
manifest.json["tokens"]section drives all styling — colors and type scale - Zone overlays on covers/dividers use tokens for font, size, color, and alignment
- SVG logos from
assets/logos/are rendered as vectors on cover pages - Content pages are styled via dynamically generated CSS from the same tokens
Keep manifest.json["tokens"] in sync with references/tokens.md.