# Swipix Brand — STYLE TOKENS (extracted from media/Brandbook/, 23 PDF)

Source: official Swipix Brand Guidelines deck (media/Brandbook/bb-1..bb-14, bb-8-1,
Color.pdf) + 8 approved app-UI screen boards (Feed / Market / Wallet / Profile /
Balance / Box Start / First reward). Extracted 2026-07-24 for Gemini image-generation
prompting. All wording below is prompt-ready English. Do NOT put competitor/brand
names (Balenciaga, Vogue, TikTok...) into generated output — they are internal mood
references only.

NOTE ON LEGACY NAMING: the brandbook screens still show "Doppy / DOPPY coin" copy
(pre-rebrand). The wordmark and mascot are Swipix. Any text rendered inside NEW
generated images must use current brand values from `reference/constants.md`, not
"Doppy".

---

## 1. Color palette (exact HEX)

### Primary
| Token | HEX | Use |
|---|---|---|
| Brand cyan | `#01E3EB` | logo, buttons, active states, accent on dark bg |
| Brand dark navy | `#071324` | primary background everywhere (near-black navy) |

### Primary gradient
- `#01E3EB → #02A9AF` (bright cyan → deep teal), used in the logo wordmark and cyan
  surfaces. Direction on samples: top-left light → bottom-right dark.

### Additional accents (bb-6 "Дополнительные оттенки")
| HEX | Description |
|---|---|
| `#FF008C` | hot magenta-pink — main accent for LIGHT backgrounds, money-highlight pills |
| `#C9016F` | deep raspberry magenta |
| `#D139FF` | vivid orchid purple |
| `#451D51` | dark plum |
| `#005390` | deep sea blue |
| `#18506F` | steel petrol blue |
| `#02A9AF` | teal (gradient partner of cyan) |
| `#C2FDFF` | pale ice cyan — the LIGHT background base |

### Monochrome logo colors
- `#000000` (on light), `#FFFFFF` (on dark).

### Typography colors (bb-7)
- `#FFFFFF` — primary text on dark
- `#01E3EB` — highlight word inside headlines on dark
- `#FF008C` — highlight (alt accent / on light)
- `#000000` — inverted text on light backgrounds

### Ambiguity flag — Color.pdf
Single swatch card: label says `HEX #140132` (deep violet-black) but the vector fill
of the swatch renders ≈`#F905F1` (bright magenta). Treat `#140132` as a documented
deep-violet UI/background tint; do not trust the magenta fill without confirmation.

### Observed in-app (sampled from screen boards, not formally in palette)
- Top-of-screen aurora: indigo `≈#373F82` melting to violet/magenta in the top corners,
  fading into `#071324` by mid-screen.
- Teal "challenge" card gradient: dark saturated teal (between `#02A9AF` and `#18506F`).

### Forbidden colors (bb-11)
- NO warm yellow/orange casts (skin or backgrounds), NO acid neon-green, NO acid
  yellow ("palette moved away from these"), NO pink-over-yellow, NO golden tones.
  Everything is cool-toned: cyan / teal / navy / magenta / violet.

---

## 2. Typography

- Single brand typeface: **Montserrat** (Regular, Medium, Bold). Both lowercase and
  uppercase usage allowed per role.
- **Headline**: Montserrat Bold, sentence/lowercase, line-height 115%, letter-spacing 1%.
  One key word inside a white headline may be colored `#01E3EB` (e.g. "Get **Rewards**").
- **Body Large** (Bold / Regular): 140% line-height, 1% letter-spacing, lowercase.
- **Body Paragraph** (Bold / Regular): 140% / 1%, lowercase.
- **Button**: Montserrat Bold, UPPERCASE, 130% line-height, 6% letter-spacing.
- Approved combinations (bb-8):
  1. Headline + Body Large (Bold) + Body Paragraph (Regular)
  2. Body Large (Bold) + Body Paragraph (Bold) + Body Paragraph (Regular)
  3. Body Large (Bold) + Body Paragraph (Regular) + BUTTON
- Prompt phrasing: "bold geometric sans-serif (Montserrat-style), tight modern
  spacing, white text on dark navy, single cyan #01E3EB accent word".

---

## 3. Logo rules

- Wordmark: **"Swipix"** — heavy italic (forward-slanted) sans wordmark with dynamic
  speed feel; fill = cyan gradient `#01E3EB → #02A9AF`; monochrome versions pure
  black or pure white.
- Clear space: "x" unit (lowercase letter height) padding on all sides — nothing may
  enter it.
- Approved backgrounds:
  - Primary: solid `#071324`.
  - Tinted dark: `#071324` + complex aurora gradient (soft violet/teal blobs).
  - Tinted light: `#C2FDFF` base + complex gradient (pale cyan with soft lavender/mint
    blobs) — use the BLACK monochrome wordmark on light.
- DON'T (bb-4): recompose or change proportions (no 3D chrome bevel letter + wordmark
  lockups); don't use a version incompatible with the background (black logo on dark);
  don't let objects (coins etc.) violate the clear zone; don't place on noisy
  psychedelic backgrounds that kill readability.

### App icon & avatar (bb-5)
- Glyph: italic capital **"S"** in cyan gradient, perfectly centered, upright (no
  rotation), flat vector — NOT beveled/chromed 3D.
- Container: rounded-square dark tile (icon) or circle (avatar), background `#071324`
  with a subtle radial darkening/vignette BEHIND the glyph for readability on noisy
  frames.
- Min size 56px; the icon may change over time (seasonal variants) but keeps
  composition rules.

---

## 4. Mascot (bb-14)

Fluffy round plush creature:
- Body/fur: **glossy light-blue/cyan fur with iridescent blue shimmer** ("glossy blue
  wool with blue iridescence"), realistic dense fur texture, photoreal render.
- Face: dark glossy near-black face patch with **huge glossy round eyes** (bright cyan
  iris, big white specular highlights), tiny cute cyan smile.
- **Silver metallic crown with red ruby gems** on the head.
- **White satin cape**, fastened at the chest with a red diamond-shaped gem clasp.
- **Silver "S" logo on the chest fur**.
- Standard turnaround: FRONT / 3/4 / SIDE / BACK / 3/4-BACK, sitting pose, one paw
  waving.
- Must interact with LIVE photographic backgrounds and real objects (sits on a desk by
  a laptop, holds a tablet) — cinematic shallow depth of field, dark ambient scene,
  cool lighting.
- Prompt base: "adorable round fluffy mascot covered in glossy iridescent light-blue
  fur, big glossy black face with huge cyan eyes, silver crown with red rubies, white
  satin cape with red gem clasp, silver S emblem on chest, photorealistic plush fur,
  studio-grade render, dark navy background, cool cyan rim light".

---

## 5. 3D icons & objects (bb-8-1)

Style: **photoreal tactile 3D still-life objects**, high detail, volumetric, everyday
items, all shot at approximately the SAME rotation angle across a set.
- Materials (canonical list): fabrics, leather, velour, velvet (puffy quilted), matte
  plastic, glass (matte or glossy / holographic iridescent), metal (clean, MEDIUM
  gloss silver — not mirror chrome).
- Colors: cyan `#01E3EB`, magenta-pink `#FF008C`, purple `#D139FF`, silver/grey.
  Exceptions only by approval.
- Canonical prop set: velvet drawstring coin pouch + silver coins; pink velvet
  check-mark badge; chess pawns (cyan glass + brushed silver); holographic disco-glitter
  star medal; pink quilted puffer wallet with a silver card; cyan plush upward arrow;
  holographic transparent credit card; teal gift box with pink satin bow; silver crown
  resting on a cyan fur ring; keys with pink pouch keychain and carabiner; blue leather
  wallet; cyan plush star; cyan fluffy verified badge with silver metal check.
- Tone restraint: careful, modest use of money/coin imagery (no cash piles, no casino
  vibes).
- Presentation in UI: objects float on small dark rounded card tiles with soft
  shadows, label text beside (e.g. "EARN … / Watch & earn").
- Prompt base: "premium tactile 3D icon, single object, realistic velvet / matte
  plastic / frosted glass / satin metal materials, cyan-teal + magenta-pink palette,
  soft studio light, deep navy background, centered, slight consistent 3/4 angle,
  high detail, no cartoon look".

## 5b. 3D illustrations (bb-9)

- Flat-on, even compositions with NO perspective distortion (orthographic feel).
- Realistic objects/textures from the same prop family, arranged on white/pale-cyan
  podium steps (light scene: `#C2FDFF`→lavender gradient) or dark navy scenes.
- Must reuse brand colors and approved backgrounds; same money-restraint rule.

---

## 6. Backgrounds & gradients

1. **Dark**: `#071324` base, optional aurora — soft indigo/violet/teal gradient blobs
   (top corners), vignette to navy. "Deep navy background with soft violet-teal
   aurora glow, subtle grain-free gradient".
2. **Light**: `#C2FDFF` pale ice-cyan base with soft lavender/mint gradient wash.
3. **Blurred bokeh**: live photographic background with STRONG depth-of-field blur
   (city / interior lights), cool-toned.
4. Teal card gradient (UI): saturated dark teal, white text on top.

---

## 7. Marketing banners — people/lifestyle (bb-10, bb-11)

- **Composition**: one hero or product in the center, clear hierarchy, minimalism,
  generous negative space. Safe zones: 140–200px top/bottom, 80–150px sides (keep all
  text inside).
- **Accent rules**: exactly ONE accent item per look — sneakers, bag, glasses or
  jewelry (or part of a 3D-object texture); never the whole outfit in the accent
  color, only a detail; accent color is the OPPOSITE of the background:
  - dark bg → accent `#01E3EB`
  - light bg → accent `#FF008C`
  - blurred bokeh bg → `#01E3EB` + `#FF008C`
  - if the background gradient already contains the accent color, the accent piece can
    be smaller (keychain, laces, frames).
- **Lighting**: high-fashion editorial — clean highlights, deep shadows, crisp rim
  light; strictly cold/cool tones, zero warm or yellow cast; natural color bounce (bg
  color softly reflects on metal, fabric, hair).
- **Poses/framing**: high-fashion editorial poses even in lifestyle shots; confident
  strong poses — squats, dynamic moves, dominant angles; low camera angle for a heroic
  feel.
- **Wardrobe (cold sport-tech, luxury-technical mood)**: oversized mini dresses,
  metallic slip dresses, puffer dresses, cut-outs, boxy minis, shirt-dresses;
  oversized shirts, cropped tops, metallic tanks, bodysuits, structured blazers,
  utility vests, puffers, cropped jackets; cargo & parachute pants, wide-leg, maxi
  with slit, mini skirts, bermudas, bike shorts; long puffers, technical parkas,
  oversized trenches, bombers, vinyl raincoats; chunky sneakers, knee-high boots,
  combat/platform boots, platform Mary Janes, sport sandals; sport eyewear, micro
  bags, nylon crossbody, carabiners, balaclavas, long gloves, ear cuffs, sport socks.
- **Materials**: liquid metal, nylon, matte leather, mercury satin, mesh, technical
  fabrics.
- **Styling principles**: proportion contrast (tight + oversized), monochrome or
  max 2 colors, material contrast (matte + metallic).
- Example approved layouts: "Become Famous / Free video promotion" (model seated on
  low block, low angle, cyan or dark look on bokeh cloudscape); "Withdraw your money /
  Sign up to pick up your first reward!" (3D keychain still-life hero).

### Banner DON'T list (hard constraints for prompts)
- Composition: no element/text overload; no random stock-photo look; no conflicting
  focal points — one hero only.
- Color: no warm yellow/orange casts; no acid neon-green or acid yellow; no pink over
  yellow, no golden tones.
- Lighting: no warm "golden hour"; no flat frontal shadowless light; no fake glow
  halos around hair/figure; no hard cut-out look — the figure must sit naturally in
  the scene (matched light and reflections).
- Materials: no plastic fake skin; no CGI/cartoon feel; no glossy "glazed" clothing
  (unless metallic); fabric texture must stay visible, no flat surfaces.
- People: no extra fingers / anatomy artifacts; characterful faces, not generic
  "vogue-pretty" (no beautification drift); no warm skin yellowness.
- Style: no acid psychedelic effects; no real brand names in output.

---

## 8. App UI patterns (screen boards)

Global: dark theme, base `#071324`; top-of-screen indigo→violet aurora gradient
(`≈#373F82` into magenta-violet corners) fading to navy; rounded cards (~16–24px
radius) in slightly lighter navy/slate with glassy translucency; pill-shaped buttons.
Bottom nav (all screens): 5 items — Watch, Create, Balance, Market, Profile; thin
white outline icons; ACTIVE tab = solid cyan `#01E3EB` icon + white label.

Buttons:
- Primary: cyan `#01E3EB` pill, dark navy UPPERCASE Bold label ("BUY", "COOL", "ACTION").
- Secondary: white pill, dark label ("WITHDRAW").
- Tertiary: translucent dark pill, white label ("WHAT IS A BOOST?").
- Money highlight: hot-pink `#FF008C` rounded pill around amounts ("$500").
- Progress bars: cyan fill on dim grey track.

Per screen:
- **Feed (Watch)**: full-bleed vertical video; top tabs "For you / Discovery / Dating"
  + LIVE badge + search; token chips top-left (coin avatars in cyan/pink rings);
  "WTF!?" dark pill top-right; right engagement rail (avatar+follow, heart 21.6k,
  comments 1.5k, share 8.1k — white icons with counters); bottom-left @username ✓ +
  caption; bottom row of donate pills: "Donate 0.1", 0.5, 1, 10 with cyan coin icon.
- **Market**: header wallet row (coin balances + white WITHDRAW pill); "Why buy Boost"
  glass card; uppercase ticker banner with cyan circular arrow CTA; "Market / History
  of purchases"; filter chips All | Boosts | Specials; product cards: left textured
  tile ("EARN up to $20" over teal velvet texture for PRIME, "EARN up to $169" over
  magenta/plum metallic texture for PRO+), right — Price $4,0, "Possible income per
  30 days up to $10", cyan BUY pill.
- **Wallet**: title bar with back arrow and "?"; intro copy; teal gradient challenge
  card "Get [$500 pink pill] in DOPPY coin … 30/365 days" with silver flame badge +
  white progress bar; balance card "≈$955.84" with coin rows (cyan D coin ~ $2.63,
  dark S coin, holographic L coin) and per-coin USD values; second challenge card
  "Get $7 … 1/7 days" with segmented cyan progress pips.
- **Profile**: violet aurora header; squircle avatar in gradient ring; reward-slot row
  ("+" tiles with cyan notification dots, one unlocked silver eye artifact); "Unlock
  all rewards +20" pill; info card (Username, bio placeholder, cyan referral link,
  Info ✏ corner tag); stats 4.3k Likes / 1872 Followers / 967 Following; 3-column
  video grid with cyan "Boosted ⭐" tag pills, play counts (2.5M…), select checkboxes;
  right vertical quick-rail: Activity(+1), Chats, Wallet, Invite; Profile tab active.
- **Balance**: header token row + WITHDRAW; horizontal task cards with 3D props
  ("EARN DOPPY / Watch & earn" — velvet coin pouch; "$15 / per friends" — chess pawns;
  "REWARDS / for tasks"); "My income" section: PRIME Boost card (textured EARN tile +
  "Earning Boost / 50% done" progress + WHAT IS A BOOST? button); black "MORE INCOME"
  pill with cyan chevron; two stat tiles "Earned today $10 / Max today $100" and
  "Available minutes today 2/5 (+4 minutes in 6 hours)" with cyan progress; teal
  Get-$500 challenge card.
- **Box Start (reward box)**: near-black navy scene; centered photoreal glass/acrylic
  cube with two glossy cyan coins inside, inner cyan glow, soft reflection below;
  ghost touch icon + "Tap to open" white Bold; minimal chrome.
- **First reward**: two large glossy cyan metallic coins (dark navy "Đ" glyph,
  beveled rim) tumbling; "You get 0.1132 DOPPY" white Bold; "≈$0.296" extra-large;
  "DOPPY is in your account — keep it up"; full-width cyan pill "COOL".
- Coin designs: main coin = cyan metallic disc, dark navy currency glyph, glossy
  bevel; secondary coins: dark disc with cyan-gradient S; holographic iridescent disc
  with script L.

---

## 9. One-paragraph style prompt (drop-in base for Gemini)

"Swipix brand style: deep navy #071324 background with soft violet-teal aurora
gradients, electric cyan #01E3EB primary accent (gradient to teal #02A9AF), hot
magenta #FF008C secondary accent, pale ice-cyan #C2FDFF for light scenes; premium
tactile photoreal 3D props in velvet, quilted puffer fabric, frosted/holographic
glass, satin silver metal; cool high-fashion editorial lighting with crisp rim light
and deep shadows, strictly no warm/yellow cast; bold Montserrat-style geometric
sans typography in white with a single cyan accent word; pill-shaped cyan buttons
with dark uppercase labels; minimalist centered composition with generous negative
space; energetic sport-tech luxury mood, glossy but restrained, no cartoon CGI look."
