Spindrift

visual.md

---
bcp_version: "1.1.1"
file_type: visual
parent: https://registry.brandcontextprotocol.dev/spindrift-1d96a1d0/.well-known/brand.md
last_updated: 2026-09-22
---

# Visual

> **Public-source demonstration.** No public Spindrift brand-guidelines PDF was found. Color, type, and logo rules below were observed from drinkspindrift.com CSS and packaging photography (7 July 2026, checked 22 September 2026). They are not a published brand book and Spindrift has not approved them.

## Observed cues

```yaml
observed_cues:
  ground: "White cans and white page fields, with fruit as the color."
  fruit_accents: "Each flavor takes an accent from its fruit. Do not invent a per-flavor palette without sampling the current product art."
  imagery: "Real cans, real fruit, farms, and process. Current site photography first. Watercolor fruit on white is 2016 packaging heritage (PR Newswire, 28 July 2016)."
  packaging_language:
    - "real squeezed fruit"
    - "proudly made the hard way™"
    - "never from concentrate"
    - "0g added sugar (sparkling water and SODA only)"
    - "Non-UPF Verified (rolling onto SODA packaging from early 2026, sparkling water from late summer 2026)"
  feel: "Premium natural packaged goods. Not neon seltzer, not luxury script."
```

The brand's visual identity is preserved below as machine-readable tokens and practical usage rules.

## Logo

```yaml
logo:
  primary:
    description: Primary logo asset detected from customer-provided surfaces.
    variants:
      - format: svg
        url: "https://drinkspindrift.com/cdn/shop/t/23/assets/new-sticker-2025-v2.svg?v=109255732055727970161741035074"
        sha256: dd2c4041b0b032465afbcb6660ac73e06101dc9b2131854fefc4bf89d5d3595a
        purpose: "Fetched from the customer's published brand surface."
```

## Logo usage

```yaml
logo_usage:
  clear_space:
    rule: Keep clear space around the logo at least equal to the height of its core mark.
    machine_value:
      unit: x-height
      multiplier: 1.0
  minimum_size:
    digital_px: 24
  approved_backgrounds:
    - type: solid_color
      color_token: surface
      note: Default light surface when contrast is sufficient.
    - type: solid_color
      color_token: surface-inverse
      note: Inverse surface when a light or reversed variant is available.
  forbidden_backgrounds:
    - type: gradient
      note: Do not place the logo over decorative gradients unless brand guidelines explicitly allow it.
    - type: patterned
      note: Patterned backgrounds reduce legibility.
  forbidden_modifications:
    - stretch
    - rotate
    - recolor
    - drop_shadow
    - glow
    - outline
    - crop
    - container_shape
    - animate
```

## Color

```yaml
color:
  tokens:
    neutral_1:
      hex: "#000000"
      role: neutral
      description: "colors extracted from customer source material."
    neutral_2:
      hex: "#EBEBEB"
      role: neutral
      description: "colors extracted from customer source material."
    primary:
      hex: "#FFFFFF"
      role: primary
      description: "colors extracted from customer source material."
    neutral_4:
      hex: "#57A823"
      role: neutral
      description: "colors extracted from customer source material."
    surface:
      hex: "#215212"
      role: surface
      description: "colors extracted from customer source material."
  approved_pairs:
    []
  forbidden_pairs:
    - foreground: primary
      background: surface
      reason: Use only if contrast testing passes for the actual type size.
```

## Typography

```yaml
typography:
  families:
    hco_gotham_ssm:
      family: "HCo Gotham SSm"
      fallback_stack: ["Helvetica Neue", "Arial", "sans-serif"]
      weights: [400]
      styles: ["normal"]
      source: "customer site extraction"
    gt_alpina:
      family: "GT Alpina"
      fallback_stack: ["Helvetica Neue", "Arial", "sans-serif"]
      weights: [400]
      styles: ["normal"]
      source: "customer site extraction"
    gtstandard_m:
      family: GTStandard-M
      fallback_stack: ["Helvetica Neue", "Arial", "sans-serif"]
      weights: [400, 500, 700]
      styles: ["normal"]
      source: "customer site extraction"
  roles:
    display: hco_gotham_ssm
    body: gt_alpina
    ui: gt_alpina
```

## Layout and components

```yaml
elevation:
  shadows:
    - "rgba(0, 0, 0, 0.24) 0px 1px 2px 0px"
spacing:
  scale_px: [12, 24, 40, 56, 64]
components:
  buttons:
    - background: "#ebebf0"
      color: "#363638"
      radius_px: 9999
      padding_px: [13, 22]
      font_weight: 400
    - background: "transparent"
      color: "#215212"
      radius_px: 9999
      padding_px: [13, 22]
      font_weight: 400
    - background: "transparent"
      color: "#215212"
      radius_px: 0
      padding_px: [0, 0]
      font_weight: 400
source: Observed from the site's live CSS, not a declared design system. Verify against your canonical tokens.
```

## Imagery

```yaml
imagery:
  photographic_style: |
    Use concrete, brand-owned imagery when available. Avoid generic stock,
    abstract AI motifs, and visuals that contradict the extracted identity.
  illustration_style: |
    Keep illustration subordinate to the brand system. Use only when it
    clarifies the message better than photography or product evidence.
  iconography_style: |
    Follow the brand's existing mark, stroke, and geometry cues. Do not invent
    decorative symbols without a human-approved precedent.
  forbidden_treatments:
    - generic AI iconography
    - wellness stock imagery (yoga, gut-health, detox)
    - an invented brand-guidelines document
    - decorative gradients behind text
    - stock business-meeting photography
```