Highspot Brand: Colors, Fonts, Logo & Visual Identity

Highspot Brand Identity

A complete profile of Highspot's visual system — colors, typography, components, and personality — extracted from https://highspot.com. Built for designers, agents, and AI tools.

Color Palette

Brand palette extracted from https://highspot.com.

Typography

Each font links to its Google Fonts page where available.

Visual Assets

%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23FBFCFD%22%20d%3D%22M15.5%200C6.94%200%200%206.94%200%2015.5%200%2024.06%206.94%2031%2015.5%2031c8.561%200%2015.501-6.94%2015.501-15.5%200-8.56-6.94-15.5-15.5-15.5Z%22%20style%3D%22fill%3A%20rgb(251%2C%20252%2C%20253)%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23006DC7%22%20fill-rule%3D%22evenodd%22%20d%3D%22M0%2015.5C0%206.94%206.94%200%2015.5%200c8.561%200%2015.501%206.94%2015.501%2015.5%200%208.56-6.94%2015.5-15.5%2015.5C6.94%2031%200%2024.06%200%2015.5Zm6.343%209.157a12.866%2012.866%200%200%200%209.158%203.793c7.14%200%2012.95-5.81%2012.95-12.95s-5.81-12.95-12.95-12.95C8.36%202.55%202.55%208.36%202.55%2015.5c0%20.719.585%201.304%201.304%201.304.719%200%201.304-.585%201.304-1.304%200-5.703%204.64-10.343%2010.343-10.343S25.843%209.797%2025.843%2015.5s-4.64%2010.343-10.342%2010.343c-2.294%200-4.533-.772-6.341-2.178l2.859-2.859A6.312%206.312%200%200%200%2015.5%2021.85a6.356%206.356%200%200%200%206.35-6.35c0-3.5-2.848-6.349-6.35-6.349-3.5%200-6.349%202.848-6.349%206.35a6.31%206.31%200%200%200%201.043%203.48l-3.85%203.851a1.291%201.291%200%200%200%200%201.825Zm9.158-5.412a3.75%203.75%200%200%200%203.745-3.745%203.75%203.75%200%200%200-3.745-3.745%203.75%203.75%200%200%200-3.746%203.745%203.75%203.75%200%200%200%203.746%203.745Z%22%20clip-rule%3D%22evenodd%22%20style%3D%22fill%3A%20rgb(0%2C%20109%2C%20199)%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E)

UI Components

Live previews rendered using Highspot's actual button styles.

Button Primary

Button Secondary

Brand Personality

Frequently Asked Questions

  1. What is Highspot's primary brand color?
    Highspot's primary brand color is #B2BCC1. It anchors the visual identity across their website, product UI, and marketing materials.
  2. What accent color does Highspot use?
    Highspot uses #002133 as an accent color, typically applied to interactive elements like links, buttons, and call-to-action emphasis.
  3. What font does Highspot use?
    Highspot uses Source Sans 3 as the primary typeface across body and headings.
  4. Does Highspot use a light or dark theme?
    Highspot's primary site uses a light color scheme, with a background of #FBFCFD.
  5. Where can I find Highspot's logo?
    Highspot's logo is available directly on their site (https://highspot.com). The current logo URL is included in the machine-readable JSON profile linked above.
  6. How was this brand profile generated?
    This profile was extracted from https://highspot.com using the Firecrawl branding extraction API, which inspects the live page's CSS, fonts, color tokens, and component styles. It is not affiliated with or endorsed by Highspot.

Machine-Readable Profile

{
  "colorScheme": "light",
  "fonts": [
    {
      "family": "Source Sans 3",
      "role": "body"
    }
  ],
  "colors": {
    "primary": "#B2BCC1",
    "secondary": "#4D6470",
    "accent": "#002133",
    "background": "#FBFCFD",
    "textPrimary": "#002133",
    "link": "#002133"
  },
  "typography": {
    "fontFamilies": {
      "primary": "Source Sans 3",
      "heading": "Source Sans 3"
    },
    "fontStacks": {
      "heading": [
        "Source Sans 3",
        "sans-serif"
      ],
      "body": [
        "Source Sans 3",
        "sans-serif"
      ],
      "paragraph": [
        "Source Sans 3",
        "sans-serif"
      ]
    },
    "fontSizes": {
      "h1": "76px",
      "h2": "24px",
      "body": "18px"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "8px"
  },
  "components": {
    "buttonPrimary": {
      "background": "#002133",
      "textColor": "#FFFFFF",
      "borderRadius": "6px",
      "borderRadiusCorners": {
        "topLeft": "6px",
        "topRight": "6px",
        "bottomRight": "6px",
        "bottomLeft": "6px"
      },
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "#FBFCFD",
      "textColor": "#1D6DE2",
      "borderRadius": "8px",
      "borderRadiusCorners": {
        "topLeft": "8px",
        "topRight": "8px",
        "bottomRight": "8px",
        "bottomLeft": "8px"
      },
      "shadow": "none"
    }
  },
  "images": {
    "logo": "data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%20155%2031%22%20data-fc-idx%3D%220%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23002133%22%20fill-rule%3D%22evenodd%22%20d%3D%22M75.212%2013.91h-5.178c-.677%200-1.208.513-1.208%201.168%200%20.668.53%201.191%201.208%201.191h4.215v3.484c-.776.704-2.267%201.504-3.994%201.504-3.38%200-5.834-2.51-5.834-5.971%200-3.447%202.453-5.948%205.834-5.948%201.475%200%202.948.586%203.935%201.564.244.261.572.405.924.405a1.25%201.25%200%200%200%201.257-1.24c0-.363-.126-.68-.338-.862-1.495-1.472-3.493-2.25-5.778-2.25-5.023%200-8.668%203.503-8.668%208.33%200%204.842%203.645%208.355%208.668%208.355%204.157%200%206.73-2.182%206.73-4.204V15.6c0-.932-.796-1.69-1.773-1.69ZM56.27%208.276c0-.721.627-1.308%201.398-1.308.718%200%201.325.599%201.325%201.308v14.032c0%20.734-.616%201.332-1.373%201.332-.745%200-1.35-.598-1.35-1.332V8.276Zm-6.085%200c0-.734.626-1.308%201.424-1.308.718%200%201.325.599%201.325%201.308v14.032c0%20.734-.617%201.332-1.374%201.332-.758%200-1.375-.598-1.375-1.332v-6.022h-8.71v6.022c0%20.734-.617%201.332-1.375%201.332-.743%200-1.349-.598-1.349-1.332V8.276c0-.721.628-1.308%201.399-1.308.718%200%201.325.599%201.325%201.308v5.587h8.71V8.276Zm41.048%200c0-.734.625-1.308%201.423-1.308.719%200%201.326.599%201.326%201.308v14.032c0%20.734-.617%201.332-1.374%201.332-.758%200-1.375-.598-1.375-1.332v-6.022h-8.71v6.022c0%20.734-.617%201.332-1.375%201.332-.744%200-1.349-.598-1.349-1.332V8.276c0-.721.627-1.308%201.398-1.308.719%200%201.325.599%201.325%201.308v5.587h8.711V8.276Zm11.995%205.398c-1.931-.5-3.6-.932-3.6-2.218%200-1.277%201.167-2.135%202.902-2.135%201.439%200%202.791.426%203.907%201.231.211.155.482.244.744.244.699%200%201.289-.57%201.289-1.243%200-.337-.133-.646-.363-.847-1.196-1.08-3.259-1.752-5.383-1.752-3.4%200-5.868%201.963-5.868%204.668%200%203.282%202.979%204.059%205.607%204.744%202.086.545%203.889%201.015%203.889%202.583%200%201.072-.887%202.325-3.386%202.325-1.972%200-3.42-.86-4.293-1.588-.205-.15-.5-.244-.77-.244-.781%200-1.265.682-1.265%201.314%200%20.304.117.602.336.844%201.327%201.277%203.531%202.04%205.895%202.04%204.613%200%206.256-2.546%206.256-4.93%200-3.509-3.27-4.356-5.897-5.036Zm10.284-6.72h5.208c3.127%200%205.311%202.115%205.311%205.142%200%202.477-1.662%205.142-5.311%205.142h-4.234v5.057c0%20.742-.611%201.345-1.362%201.345a1.343%201.343%200%200%201-1.338-1.345V8.69c0-.957.774-1.735%201.726-1.735Zm4.893%202.387h-3.919v5.504h3.919c1.68%200%202.852-1.161%202.852-2.749%200-1.613-1.146-2.755-2.852-2.755Zm15.563-2.387c-4.662%200-8.455%203.743-8.455%208.343s3.793%208.343%208.455%208.343%208.454-3.742%208.454-8.343c0-4.6-3.792-8.343-8.454-8.343Zm6.036%208.343c0%203.284-2.708%205.956-6.036%205.956-3.328%200-6.036-2.672-6.036-5.956%200-3.284%202.708-5.956%206.036-5.956%203.328%200%206.036%202.672%206.036%205.956Zm2.948-8.343h10.773c.689%200%201.208.537%201.208%201.248%200%20.66-.542%201.198-1.208%201.198h-4.019v12.895c0%20.742-.619%201.345-1.38%201.345a1.352%201.352%200%200%201-1.355-1.345V9.4h-4.019c-.677%200-1.208-.548-1.208-1.247a1.19%201.19%200%200%201%201.208-1.199Z%22%20clip-rule%3D%22evenodd%22%20style%3D%22fill%3A%20rgb(0%2C%2033%2C%2051)%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23FBFCFD%22%20d%3D%22M15.5%200C6.94%200%200%206.94%200%2015.5%200%2024.06%206.94%2031%2015.5%2031c8.561%200%2015.501-6.94%2015.501-15.5%200-8.56-6.94-15.5-15.5-15.5Z%22%20style%3D%22fill%3A%20rgb(251%2C%20252%2C%20253)%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23006DC7%22%20fill-rule%3D%22evenodd%22%20d%3D%22M0%2015.5C0%206.94%206.94%200%2015.5%200c8.561%200%2015.501%206.94%2015.501%2015.5%200%208.56-6.94%2015.5-15.5%2015.5C6.94%2031%200%2024.06%200%2015.5Zm6.343%209.157a12.866%2012.866%200%200%200%209.158%203.793c7.14%200%2012.95-5.81%2012.95-12.95s-5.81-12.95-12.95-12.95C8.36%202.55%202.55%208.36%202.55%2015.5c0%20.719.585%201.304%201.304%201.304.719%200%201.304-.585%201.304-1.304%200-5.703%204.64-10.343%2010.343-10.343S25.843%209.797%2025.843%2015.5s-4.64%2010.343-10.342%2010.343c-2.294%200-4.533-.772-6.341-2.178l2.859-2.859A6.312%206.312%200%200%200%2015.5%2021.85a6.356%206.356%200%200%200%206.35-6.35c0-3.5-2.848-6.349-6.35-6.349-3.5%200-6.349%202.848-6.349%206.35a6.31%206.31%200%200%200%201.043%203.48l-3.85%203.851a1.291%201.291%200%200%200%200%201.825Zm9.158-5.412a3.75%203.75%200%200%200%203.745-3.745%203.75%203.75%200%200%200-3.745-3.745%203.75%203.75%200%200%200-3.746%203.745%203.75%203.75%200%200%200%203.746%203.745Z%22%20clip-rule%3D%22evenodd%22%20style%3D%22fill%3A%20rgb(0%2C%20109%2C%20199)%20!important%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E"
  ,
  "favicon": "https://www.highspot.com/wp-content/themes/highspot/img/favicon.png",
  "ogImage": "https://www.highspot.com/wp-content/uploads/2025/09/homepage-role-play-skill-assessment-feature-focus-4x3-1.webp",
  "logoHref": "https://www.highspot.com/"
}