---
name: etoro-brand
description: eToro brand rules for campaign copy, creative, landing pages, and email-adjacent assets. Use when work must stay on-brand for eToro marketing execution, especially for color, logo, typography, tone, CTA treatment, and asset review. Full V1 design system reference at references/brand-design-system-v1.md
---

# eToro Brand & Design System V1

> Source: eToro Brand Book (272MB PDF) + 2 Figma Design System files. Updated March 30, 2026.
> Full spec: `references/brand-design-system-v1.md`
> Figma Design System: `g2KVC2hCTIA5nsvDnZXWds` | Brand Book: `Pkx79yKB8YFZ6NZLcCAyjX`

Use this skill for eToro marketing assets that need brand guardrails before copy, design, or compliance review.

## Colors

### Primary Palette
| Name | Hex | Usage |
|------|-----|-------|
| eToro Green (Marketing) | `#13C636` | Primary brand, CTAs, highlights |
| eToro Green (Product UI) | `#0EB12E` | In-product UI elements |
| Navy / Dark Blue | `#000021` | Backgrounds, text, headers |
| Light Blue | `#C0E8FD` | Accents, informational sections |
| White | `#FFFFFF` | Backgrounds, text on dark |

### Secondary Colors
| Name | Hex | Usage |
|------|-----|-------|
| Turquoise | `#6BF5C0` | Accents, gradients |
| Pink Pop | `#F887CC` | Special promotions |
| Tangerine | `#E96E14` | Warnings, secondary CTAs |
| Yellow | `#F7B42C` | Highlights, awards |

### Gradients
- **Primary:** `#13C636` → `#6BF5C0` (hero sections)
- **Secondary:** `#13C636` → `#C0E8FD` (informational)
- **Promo:** `#E96E14` → `#F7B42C` (promotions)

### Text on Backgrounds
| Background | Text | Links |
|-----------|------|-------|
| White | `#000021` | `#13C636` |
| Gray | `#000021` | `#13C636` |
| Dark Blue | `#FFFFFF` | `#13C636` |

### Functional
- `#13C636` — gains, success, positive P&L
- `#E31937` — losses, negative P&L, warnings

## Typography

**Font:** eToro Variable Font (Madera)
**CDN:** `https://marketing.etorostatic.com/cache1/fonts/etoro/eToro-VF-v0.7.ttf`
**Weights:** Light (350), Regular (400), Medium (500), Bold (700)

### Desktop Scale
| Style | Size | Weight | Line Height |
|-------|------|--------|-------------|
| H1 (with CTA) | 28px | 500 | 32px |
| H1 (no CTA) | 32px | 500 | 38px |
| H2 | 30–38px | 350/700 or 500 | 34–46px |
| H3 | 24px | 500 | 30px |
| Subtitle | 20px | 500 | 26px |
| Body | 18px | 400 | 27px |
| Body Bold | 18px | 700 | 27px |
| CTA Button | 16px | 500 | — |
| Menu | 16px | 500 | — |
| Tooltip | 14px | 400 | 21px |
| Fine Print | 12px | 400 | 18px |

### Mobile Scale
| Style | Size | Weight | Line Height |
|-------|------|--------|-------------|
| H1 | 24–28px | 500 | 28–32px |
| H2 | 24px | 350/700 | 28px |
| H3 | 20px | 500–700 | 24px |
| Body | 16px | 400 | 24px |
| Fine Print | 11px | 400 | 16px |

## Grid & Breakpoints

| Breakpoint | Width | Columns | Gutter | Margin |
|-----------|-------|---------|--------|--------|
| Mobile | <768px | 8 | 16px | 16px |
| Tablet | 768–1023px | 20 | 24px | 60px |
| Desktop S | 1024–1279px | 20 | 24px | 60px |
| Desktop M | 1280–1439px | 20 | 24px | 200px |
| Desktop L | 1440–1919px | 20 | 24px | 200px |
| Desktop XL | 1920px+ | 20 | 24px | 372px |

**Max content width:** 1176px

## Core Rules

1. Use primary palette unless brief explicitly approves variant.
2. Never use secondary colors without explicit brief approval.
3. Use official eToro logo assets only — never tilt, rotate, distort, recolor, or redraw.
4. Minimum logo clear space: height of the 'e' in eToro. Minimum digital width: 80px.
5. Primary logo: Green on white, or white on dark backgrounds.
6. Voice: confident but approachable, clear and direct, empowering, human, educational.
7. Copy: short sentences, active voice, benefit-led, no jargon, no fluff.
8. CTA buttons: always action verbs ("Start Trading", "Join Now", "Learn More").
9. Language-specific covers: Chinese SC/TC → Noto Sans; Arabic → Zokak; Russian → Big Shoulders Display.

## Logo

1. Preferred logo/background pairings:
- green background -> white logo
- light blue background -> navy logo
- white background -> green logo
- navy background -> green logo
- pink pop, yellow, tangerine, turquoise -> white logo
2. Logo taglines or sub-brands such as `eToro academy` require HQ approval.
3. Horns and rounded wordmark proportions are part of the logo asset. Do not recreate them manually.

## Typography

### Marketing and Creative

1. Default font family is `eToro Variable`.
2. Follow the LP design-system variants from Figma instead of legacy families:
- `eToro Variable 0.7 Regular Compressed` and `Bold Compressed` for cover/header styles
- `eToro Variable 0.7 Regular`, `Medium`, `Semibold`, and `Bold` for headings and body
- `eToro Variable 0.7 Numbers` for numeric treatments, tickers, and data-led UI
3. Use weight, compression, and approved numeric variants inside `eToro Variable` for hierarchy. Do not switch to `Tusker`, `Madera`, or `DIN OT` for new work.
4. Default text is sentence case. Use uppercase only where the Figma text style explicitly does so, such as some compressed cover treatments or selected table labels.
5. Preferred desktop type patterns from the referenced LP design-system node:
- Cover / Header Light: `140 / 130`, `Regular Compressed`, letter spacing `1`
- Cover / Header Heavy: `140 / 130`, `Bold Compressed`, letter spacing `2`
- Cover / Subtitle: `28 / 36`, `Regular` or `Bold`
- H1: `32 / 40`, `Regular` or `Bold`
- H2: `24 / 30`, `Regular`, `Medium`, or `Bold`
- H3: `38 / 46`, `Medium`
- Body: `19 / 28`, `Regular` or `Semibold`
- Cards / small labels: `10-12 / 14`
- Numbers styles use `eToro Variable 0.7 Numbers` or condensed variable settings from the design system, depending on the component

### Email

For all email work, ignore Figma font families and use this exact stack:

```text
-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol
```

This applies to:
- MJML defaults
- inline text styles
- button text
- fallback HTML fragments

Do not try to embed or simulate `eToro Variable` in email output.

## CTA Rules

1. Primary CTA background: `#13C636`
2. Primary CTA text: white unless contrast requires navy
3. Prefer pill or softly rounded button shapes
4. Keep CTA copy short and direct
5. Secondary CTA can be transparent with a green border and green text when hierarchy requires it.

## Iconography

1. Prefer clean, rounded, flat iconography with a consistent medium stroke.
2. Keep icons single-color unless the approved visual system requires a filled circle treatment.
3. Use green outline icons on dark backgrounds and white outline icons on green backgrounds.

## Photography and Visual Style

1. Prefer authentic, modern, product-aware visuals.
2. Avoid gambling cues, jackpot imagery, or get-rich-quick aesthetics.
3. Avoid cluttered layouts and weak visual hierarchy.
4. Make disclaimer placement deliberate and readable.
5. Prefer real people, natural lighting, modern settings, diverse subjects, and device mockups when relevant.
6. Avoid stock-looking poses and outdated aesthetics.

## Layout Guidance

1. Standard ad composition:
- logo near the top-left
- strong headline first
- supporting copy second
- product visual or photography as the hero
- CTA clearly separated from body copy
- disclaimer small but readable at the bottom
2. Keep hierarchy obvious. Important numbers, offers, and proof points should scan in one pass.

## Copy and Proof Points

1. Lead with benefits and use numbers where they improve credibility.
2. If a brief calls for company stats or tier thresholds, verify them against the current approved source before publishing. Do not rely on stale embedded numbers.

## Brand Voice

1. Keep the tone confident, not arrogant.
2. Keep the tone approachable, not dumbed-down.
3. Keep the tone modern, not slang-heavy or trend-chasing.
4. Keep the tone empowering, not preachy.
5. Prefer active voice, short sentences, direct address, and benefit-led framing.

## Banner Specifications (from Brandbook)

1. CTA shape: **capsule** (not rounded-rectangle — the corners go fully round at the short edges)
2. CTA copy: **maximum 3 words** in English
3. CTA padding: top and bottom = **half the font size** (e.g., font-size 16px → padding 8px top/bottom)
4. CTA text must not enter the rounded arc area of the capsule
5. Minimum font sizes: Madera **11pt**, Tusker **16pt**
6. Text alignment follows logo alignment: left logo → left text, center logo → center text
7. Standard banner sizes: 160×600, 300×250, 970×250
8. Every banner must include regional regulatory disclaimer in readable small print

## Social Content Guidelines (from Brandbook)

1. Include **"Capital is at risk"** on all financial social posts
2. Add **"Other fees apply"** where relevant
3. Include AFSL 491139 and PDS/TMD references for Australian market
4. Include educational disclaimer where required: *"This content is intended for information and educational purposes only and should not be considered financial product advice or any recommendation"*
5. Logo placement: **top-center or top-left** on all social posts
6. CTA: pill/rounded rectangle, centered, action-oriented (max ~3 words)
7. Acceptable background treatments: solid bold fills (green, orange, black, yellow, pink, dark navy)
8. Highlight key words in contrasting colors within headlines
9. Use app mockups to showcase features
10. Animals and playful/meme-adjacent imagery acceptable for social tone when appropriate

## Photography Rules (from Brandbook)

### What to use
- Authentic, everyday people — not overly staged
- Real people in relatable environments
- Culturally inclusive, diverse international subjects
- Natural expressions: laughing, candid moments
- Modern urban environments, collaborative workspaces, social/dining settings
- Organic, relaxed device usage
- Photography angles: **moderate to surprising** (varied, not always eye-level)
- Natural lighting preferred
- Casual, typical daywear on subjects

### Technology photography
- People-focused (not device-only shots)
- Candid authentic feel
- Show genuine engagement with devices

### What to avoid
- Overly posed or stock-looking images
- Gambling cues, casino aesthetics, jackpot imagery
- Get-rich-quick visual metaphors
- Culturally non-inclusive casting

## Video Guidelines (from Brandbook)

### Footage
- Similar rules to photography: authentic, friendly people in relatable settings
- Dynamic typography overlays for emphasis
- Bold typographic treatments on footage

### Animation
- Style: *"speaks to the fluidity of the financial space, adding elements of playfulness and excitement"*
- Range from simple GIF to advanced motion
- **Intros:** Signature typographic titles over eToro color palette
- **Outros:** Logo centered on green gradient background
- Keep playful and exciting even for financial subject matter

## App Screen Guidelines (from Brandbook)

- Show **one feature at a time**
- Corners are **rounded** on all device frames
- Devices must be **generic** — no manufacturer logos or identifying hardware features
- Interactive navigation can be demonstrated
- Popouts can be visually layered for depth and emphasis
- Positive P&L: green text; Negative P&L: red/pink text

## Iconography Rules (from Brandbook)

- Style: *"clean, rounded flat"* — simple and contemporary
- All icons in **one color** only
- Sticker-style format: circular background with white line-art icon inside
- Can be placed on any background
- Green circular sticker with white icons = standard treatment
- Apply same circular format to asset/brand logos (logo centered, sticker background matches logo's original background color)
- Due to legal constraints: use asset logos **exactly as they appear on the eToro platform** — no modifications

## Founding & Company Context

- Founded: **2007**
- Registered users: **over 32 million**
- Countries: **more than 100**
- Vision: *"a world where everyone can trade and invest in a simple and transparent way"*
- Mission: *"to open the global markets, connect you to leading investors and give you the tools you need to grow your knowledge and wealth"*

## Core Brand Values (exact from Brandbook)

1. **Keeping it simple** — *"remove barriers and make online trading and investing accessible to everyone, simpler and more transparent"*
2. **Constantly innovating** — *"founded to disrupt traditional finance and innovation is in our DNA"*
3. **Better together** — power of shared knowledge, community-first

## Key Statistics

1. Common proof points may include user scale, market coverage, product breadth, or founding year.
2. Do not hard-code company stats in final outputs unless they have been re-verified against an approved current source.
3. If a task needs exact numbers, fetch them from the approved current source and cite the date used in the working notes or review output.

## Do's and Don'ts

### Do

- Use a clean, modern aesthetic
- Use green accents intentionally on key elements
- Keep hierarchy obvious and easy to scan
- Use authentic photography and product-aware visuals
- Use numbers and proof points where they add credibility
- Keep logos, CTAs, and disclaimers readable

### Don't

- Use gambling imagery or casino cues
- Use get-rich-quick messaging or hype visuals
- Use cluttered compositions or weak hierarchy
- Use off-brand colors without explicit brief approval
- Use stock-looking poses or outdated aesthetics
- Use all-caps body copy
- Stretch, rotate, redraw, or typeset the logo

## Brand Review Checklist

- [ ] Correct core colors
- [ ] Secondary colors used only when approved by the brief
- [ ] Official logo treatment
- [ ] Correct logo/background pairing
- [ ] `eToro Variable` variants used for non-email brand typography
- [ ] No fallback to legacy `Tusker`, `Madera`, or `DIN OT` in new work
- [ ] Email work uses the required system stack instead of Figma fonts
- [ ] Tone is confident and balanced
- [ ] No off-brand imagery or visual gimmicks
- [ ] Disclaimer placement is deliberate and readable
- [ ] Claims, stats, and tier references have been re-verified against an approved current source

## References

- `references/brand-reference.md`
- `references/creative-brand-guidelines.md`
- `references/email-design-system.md`
- `references/creative-asset-sizes.md`
- `references/product-screens/`
- [etoro-disclaimers](../etoro-disclaimers/SKILL.md)
