# Gamma Brand Identity

A complete profile of **Gamma**'s visual system — colors, typography, components, and personality — extracted from https://gamma.app/. Built for designers, agents, and AI tools.

- Page: https://characterquilt.com/branding/gamma
- Machine-readable JSON: https://characterquilt.com/branding/gamma.json
- Per-page llms.txt: https://characterquilt.com/branding/gamma/llms.txt

## Quick Facts

| Field | Value |
|---|---|
| Primary | #0858F7 |
| Accent | #0540AD |
| Body Font | PPMori |
| Heading Font | PPMori |

## Color Palette

- primary: #0858F7
- secondary: #0540AD
- accent: #0540AD
- background: #FFFFFF
- textPrimary: #002253
- link: #002253

## Typography

- primary: PPMori — https://fonts.google.com/specimen/PPMori
- heading: PPMori — https://fonts.google.com/specimen/PPMori

## Visual Assets

- Logo: data:image/svg+xml;utf8,%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%201111%20192%22%20style%3D%22fill%3Avar(--chakra-colors-deepocean-950)%22%20data-fc-idx%3D%220%22%3E%3Cpath%20d%3D%22M47.2%2C14.4c-14.4%2C8.2-26%2C19.6-34.4%2C33.6C4.3%2C62.1%2C0%2C77.7%2C0%2C94.3s4.3%2C32.2%2C12.7%2C46.3c8.5%2C14.1%2C20%2C25.4%2C34.4%2C33.6%2C14.4%2C8.2%2C30.4%2C12.4%2C47.7%2C12.4h69.8v-112.5h-81v39.1h38.2v31.8h-25.6c-9.1%2C0-17.6-2.3-25.2-6.9-7.6-4.6-13.8-10.8-18.3-18.4-4.5-7.7-6.7-16.2-6.7-25.3s2.3-17.7%2C6.7-25.3c4.5-7.7%2C10.6-13.9%2C18.3-18.4%2C7.6-4.6%2C16.1-6.9%2C25.2-6.9h68.5V2h-69.8c-17.3%2C0-33.3%2C4.2-47.7%2C12.4h0Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M267.6.2c-42.7%2C0-77.4%2C34.8-77.4%2C77.6v108.8h42v-54.6h70.8v54.6h42v-108.8c0-42.8-34.7-77.6-77.4-77.6ZM303%2C93h-70.8v-15.3c0-19.6%2C15.9-35.5%2C35.4-35.5s35.4%2C15.9%2C35.4%2C35.5v15.3Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M576.4%2C0c-32.1%2C0-58.2%2C26.2-58.2%2C58.4v74.2c0%2C8.7-7%2C15.7-15.7%2C15.7s-15.7-7-15.7-15.7V58.5c0-32.2-26.1-58.4-58.2-58.4s-58.2%2C26.2-58.2%2C58.4v128.2h42.6V58.5c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v74.1c0%2C32.2%2C26.1%2C58.4%2C58.2%2C58.4s58.2-26.2%2C58.2-58.4V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v128.3h42.6V58.4c0-32.2-26.1-58.4-58.2-58.4h0Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M1033.1.3c-42.7%2C0-77.4%2C34.8-77.4%2C77.6v108.8h42v-54.6h70.8v54.6h42v-108.8c0-42.8-34.7-77.6-77.4-77.6ZM1068.5%2C93.2h-70.8v-15.3c0-19.6%2C15.9-35.5%2C35.4-35.5s35.4%2C15.9%2C35.4%2C35.5v15.3Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M872%2C0c-32.1%2C0-58.2%2C26.2-58.2%2C58.4v74.2c0%2C8.7-7%2C15.7-15.7%2C15.7s-15.7-7-15.7-15.7V58.4c0-32.2-26.1-58.4-58.2-58.4s-58.2%2C26.2-58.2%2C58.4v128.3h42.6V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v74.2c0%2C32.2%2C26.1%2C58.4%2C58.2%2C58.4s58.2-26.2%2C58.2-58.4V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v128.3h42.6V58.4c0-32.2-26.1-58.4-58.2-58.4Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3C%2Fsvg%3E
- Favicon: https://static.gamma.app/favicons/favicon_light.ico
- Social card (og:image): https://static.gamma.app/images/gamma-banner-8d71c455.png

## UI Components

- buttonPrimary: background=#0540AD, textColor=#FFFFFF, borderRadius=24px, shadow=none
- buttonSecondary: background=#FFFFFF, textColor=#002253, borderColor=#D0E6FE, borderRadius=24px, shadow=rgba(255, 255, 255, 0.48) 0px 2px 4px 0px

## Brand Personality

Tone: modern · Energy: high · Audience: tech-savvy professionals and businesses

## Gamma Brand in the Wild

Real-world brand assets — ads, campaigns, marketing materials.

- **Vascular Surgery | Gamma**
  - Image: https://prod-dovemed.s3.amazonaws.com/media/images/shutterstock_61927813.original_4pnWFEv.jpg
  - Source: https://gamma.app/docs/Vascular-Surgery-t1iq2g6y76w98ve
- **Social Media Campaign | Gamma**
  - Image: https://www.freeiconspng.com/uploads/blogger-logo-icon-png-0.png
  - Source: https://gamma.app/docs/Social-Media-Campaign--nixjn0wys2qklt9
- **Born towards the sun, following the light. | Gamma**
  - Image: https://wallpapercave.com/wp/wp5486884.jpg
  - Source: https://gamma.app/docs/Born-towards-the-sun-following-the-light-ecc1beh6s4cbfsk
- **Exploring Gamma's Blog Functionality: Key Features and Capabilities | Gamma  Community**
  - Image: https://images.tightknit.ai/og/post?record_id=zzwn3oa6pa7m&tenant_id=8217386c-3e10-4dba-a8fc-a226284ca69e
  - Source: https://community.gamma.app/x/ideas-and-requests/zzwn3oa6pa7m/exploring-gammas-blog-functionality-key-features-a
- **ADsVertisers ® ChatGPT Guide + ADsVertisers ® AI - Cheat Sheet**
  - Image: https://inspirefirst.com/wp-content/uploads/2022/11/blog-writing-nick-morrison-FHnnjk1Yj7Y-unsplash-scaled.jpeg
  - Source: https://gamma.app/docs/ADsVertisers-ChatGPT-Guide-ADsVertisers-AI-Cheat-Sheet-mtc1oyi28ry0i8u
- **Welcome to Our D&K Grocery Store! | Gamma**
  - Image: https://www.citizen-times.com/gcdn/presto/2018/09/27/PASH/c03d035d-0895-42e0-bec4-f96b8155ee32-STC1Brd_07-10-2018_Times_1_A001__2018_07_09_IMG_Fresh_raw_red_meat_1_1_J2MBESEO_L1249513357_IMG_Fresh_raw_red_meat_1_1_J2MBESEO.jpg
  - Source: https://gamma.app/docs/Welcome-to-Our-DK-Grocery-Store-pc3jirs7yqn34hv

## Working with these fonts

Not found on Google Fonts? Agent Instructions that you can follow if you have permission to use the fonts:

CharacterQuilt.com suggests this flow that can help:

1. Open the company's homepage in a browser with DevTools open.
2. In the Network tab, filter by "Font" (or by extension: woff2, woff, ttf, otf).
3. Hard-reload the page and click around (pricing, blog, careers) — some weights only load on specific routes.
4. For each captured font URL: right-click → Save As to download the file locally.
5. View the page's CSS (DevTools → Sources, or curl the stylesheet URLs) and copy out the matching @font-face declarations. Rewrite each `src: url(...)` to point to your local file path.

Programmatic alternative: load the URL with Playwright or Puppeteer, listen for `response` events whose `Content-Type` starts with `font/`, and write the body to disk. The CSS extraction step is the same.

Only do this if you have permission to use the brand assets — most proprietary fonts are licensed and may not be redistributable.

## Machine-Readable Profile

```json
{
  "colorScheme": "light",
  "fonts": [
    {
      "family": "PPMori",
      "role": "body"
    }
  ],
  "colors": {
    "primary": "#0858F7",
    "secondary": "#0540AD",
    "accent": "#0540AD",
    "background": "#FFFFFF",
    "textPrimary": "#002253",
    "link": "#002253"
  },
  "typography": {
    "fontFamilies": {
      "primary": "PPMori",
      "heading": "PPMori"
    },
    "fontStacks": {
      "heading": [
        "ESBuild",
        "sans-serif"
      ],
      "body": [
        "PPMori",
        "sans-serif"
      ],
      "paragraph": [
        "PPMori",
        "sans-serif"
      ]
    },
    "fontSizes": {
      "h1": "60px",
      "h2": "96px",
      "body": "18px"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "7px"
  },
  "components": {
    "buttonPrimary": {
      "background": "#0540AD",
      "textColor": "#FFFFFF",
      "borderRadius": "24px",
      "borderRadiusCorners": {
        "topLeft": "24px",
        "topRight": "24px",
        "bottomRight": "24px",
        "bottomLeft": "24px"
      },
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "#FFFFFF",
      "textColor": "#002253",
      "borderColor": "#D0E6FE",
      "borderRadius": "24px",
      "borderRadiusCorners": {
        "topLeft": "24px",
        "topRight": "24px",
        "bottomRight": "24px",
        "bottomLeft": "24px"
      },
      "shadow": "rgba(255, 255, 255, 0.48) 0px 2px 4px 0px"
    }
  },
  "images": {
    "logo": "data:image/svg+xml;utf8,%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%201111%20192%22%20style%3D%22fill%3Avar(--chakra-colors-deepocean-950)%22%20data-fc-idx%3D%220%22%3E%3Cpath%20d%3D%22M47.2%2C14.4c-14.4%2C8.2-26%2C19.6-34.4%2C33.6C4.3%2C62.1%2C0%2C77.7%2C0%2C94.3s4.3%2C32.2%2C12.7%2C46.3c8.5%2C14.1%2C20%2C25.4%2C34.4%2C33.6%2C14.4%2C8.2%2C30.4%2C12.4%2C47.7%2C12.4h69.8v-112.5h-81v39.1h38.2v31.8h-25.6c-9.1%2C0-17.6-2.3-25.2-6.9-7.6-4.6-13.8-10.8-18.3-18.4-4.5-7.7-6.7-16.2-6.7-25.3s2.3-17.7%2C6.7-25.3c4.5-7.7%2C10.6-13.9%2C18.3-18.4%2C7.6-4.6%2C16.1-6.9%2C25.2-6.9h68.5V2h-69.8c-17.3%2C0-33.3%2C4.2-47.7%2C12.4h0Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M267.6.2c-42.7%2C0-77.4%2C34.8-77.4%2C77.6v108.8h42v-54.6h70.8v54.6h42v-108.8c0-42.8-34.7-77.6-77.4-77.6ZM303%2C93h-70.8v-15.3c0-19.6%2C15.9-35.5%2C35.4-35.5s35.4%2C15.9%2C35.4%2C35.5v15.3Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M576.4%2C0c-32.1%2C0-58.2%2C26.2-58.2%2C58.4v74.2c0%2C8.7-7%2C15.7-15.7%2C15.7s-15.7-7-15.7-15.7V58.5c0-32.2-26.1-58.4-58.2-58.4s-58.2%2C26.2-58.2%2C58.4v128.2h42.6V58.5c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v74.1c0%2C32.2%2C26.1%2C58.4%2C58.2%2C58.4s58.2-26.2%2C58.2-58.4V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v128.3h42.6V58.4c0-32.2-26.1-58.4-58.2-58.4h0Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M1033.1.3c-42.7%2C0-77.4%2C34.8-77.4%2C77.6v108.8h42v-54.6h70.8v54.6h42v-108.8c0-42.8-34.7-77.6-77.4-77.6ZM1068.5%2C93.2h-70.8v-15.3c0-19.6%2C15.9-35.5%2C35.4-35.5s35.4%2C15.9%2C35.4%2C35.5v15.3Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3Cpath%20d%3D%22M872%2C0c-32.1%2C0-58.2%2C26.2-58.2%2C58.4v74.2c0%2C8.7-7%2C15.7-15.7%2C15.7s-15.7-7-15.7-15.7V58.4c0-32.2-26.1-58.4-58.2-58.4s-58.2%2C26.2-58.2%2C58.4v128.3h42.6V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v74.2c0%2C32.2%2C26.1%2C58.4%2C58.2%2C58.4s58.2-26.2%2C58.2-58.4V58.4c0-8.7%2C7-15.7%2C15.7-15.7s15.7%2C7%2C15.7%2C15.7v128.3h42.6V58.4c0-32.2-26.1-58.4-58.2-58.4Z%22%20style%3D%22fill%3A%20rgb(0%2C%2034%2C%2083)%20!important%3B%22%2F%3E%3C%2Fsvg%3E",
    "favicon": "https://static.gamma.app/favicons/favicon_light.ico",
    "ogImage": "https://static.gamma.app/images/gamma-banner-8d71c455.png",
    "logoHref": "/",
    "logoAlt": "Layer_1"
  },
  "__llm_logo_reasoning": {
    "selectedIndex": 0,
    "reasoning": "Selected #0 because it is visible, links to the homepage, and is located at the top of the page, which is typical for a main brand logo.",
    "confidence": 0.9,
    "source": "llm"
  },
  "__llm_button_reasoning": {
    "primary": {
      "index": 0,
      "text": "Start for free",
      "reasoning": "Button #0 is selected as the primary CTA because it uses a vibrant brand color (#0540AD) and has action-oriented text ('Start for free'), which is typical for a primary call-to-action."
    },
    "secondary": {
      "index": 6,
      "text": "Watch video",
      "reasoning": "Button #6 is selected as the secondary CTA because it has a different background color (#FFFFFF) and offers a supportive action ('Watch video'), which complements the primary action."
    },
    "confidence": 0.95
  },
  "personality": {
    "tone": "modern",
    "energy": "high",
    "targetAudience": "tech-savvy professionals and businesses"
  },
  "designSystem": {
    "framework": "chakra",
    "componentLibrary": ""
  },
  "confidence": {
    "buttons": 0.95,
    "colors": 0.9,
    "overall": 0.925
  },
  "__llm_metadata": {
    "logoSelection": {
      "llmCalled": true,
      "llmSucceeded": true,
      "finalSource": "llm",
      "rawLogoSelection": {
        "selectedLogoIndex": 0,
        "selectedLogoReasoning": "Selected #0 because it is visible, links to the homepage, and is located at the top of the page, which is typical for a main brand logo.",
        "confidence": 0.9
      }
    },
    "buttonClassification": {
      "llmCalled": true,
      "llmSucceeded": true
    }
  }
}
```