superhi

SuperHi Brand Identity

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

Colors

Primary

#2727E6

Accent

#2727E6

Typography

Body Font

Haas Grot Text

Heading

Haas Grot Display

Color Palette

Brand palette extracted from https://www.superhi.com/.
Primary: #2727E6
RGB: rgb(39, 39, 230)
Secondary: #16AB59
RGB: rgb(22, 171, 89)
Accent: #2727E6
RGB: rgb(39, 39, 230)
Background: #F0F6FF
RGB: rgb(240, 246, 255)
Text Primary: #2727E6
RGB: rgb(39, 39, 230)
Link: #2727E6
RGB: rgb(39, 39, 230)

Typography

Each font links to its Google Fonts page where available.
Primary: Haas Grot Text Google Fonts →
Heading: Haas Grot Display Google Fonts →

UI Components

Live previews rendered using SuperHi's actual button styles.

Input

Background: #F0F6FF
Text Color: #000000
Border Color: null
Border Radius: 5000px
Shadow: none

Button Primary

Background: #2727E6
Text Color: #FFFFFF
Border Radius: 48px
Shadow: none

Button Secondary

Background: #FFFFFF
Text Color: #111118
Border Radius: 48px
Shadow: none

Brand Personality

Tone: modern
Energy: medium
Audience: creative professionals and students

Frequently Asked Questions

What is SuperHi's primary brand color?
SuperHi's primary brand color is #2727E6. It anchors the visual identity across their website, product UI, and marketing materials.

What font does SuperHi use?
SuperHi uses Haas Grot Text for body text and Haas Grot Display for headings. Fonts were detected on https://www.superhi.com/ as part of their live design system.

Does SuperHi use a light or dark theme?
SuperHi's primary site uses a light color scheme, with a background of #F0F6FF.

Where can I find SuperHi's logo?
SuperHi's logo is available directly on their site (https://www.superhi.com/). The current logo URL is included in the machine-readable JSON profile linked above.

How was this brand profile generated?
This profile was extracted from https://www.superhi.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 SuperHi.

Machine-Readable Profile

Direct endpoints for agents, designers, and tooling. No login or auth required.

{
  "colorScheme": "light",
  "fonts": [
    {
      "family": "Haas Grot Text",
      "role": "body"
    },
    {
      "family": "Haas Grot Display",
      "role": "heading"
    }
  ],
  "colors": {
    "primary": "#2727E6",
    "secondary": "#16AB59",
    "accent": "#2727E6",
    "background": "#F0F6FF",
    "textPrimary": "#2727E6",
    "link": "#2727E6"
  },
  "typography": {
    "fontFamilies": {
      "primary": "Haas Grot Text",
      "heading": "Haas Grot Display"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "16px"
  },
  "components": {
    "input": {
      "background": "#F0F6FF",
      "textColor": "#000000",
      "borderColor": null,
      "borderRadius": "5000px",
      "shadow": "none"
    },
    "buttonPrimary": {
      "background": "#2727E6",
      "textColor": "#FFFFFF",
      "borderRadius": "48px",
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "#FFFFFF",
      "textColor": "#111118",
      "borderRadius": "48px",
      "shadow": "none"
    }
  },
  "images": {
    "logo": "data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20104%2046%22%20data-fc-idx%3D%220%22%3E%3Cg%20class%3D%22SiteHeader_logoLetter__tW243%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0%2025.3886H2.52622C2.62735%2026.2346%202.92497%2026.838%203.41893%2027.1991C3.9126%2027.5602%204.54907%2027.7408%205.32777%2027.7408C6.06856%2027.7408%206.69201%2027.574%207.19856%2027.2403C7.7051%2026.9068%207.9583%2026.4238%207.9583%2025.791C7.9583%2025.2822%207.81246%2024.8764%207.52135%2024.5737C7.2301%2024.2711%206.78389%2024.0373%206.18243%2023.8722L3.59935%2023.1293C2.5103%2022.8198%201.7031%2022.3127%201.17774%2021.6076C0.652099%2020.9027%200.38935%2020.0241%200.38935%2018.9718C0.38935%2018.394%200.503362%2017.8611%200.731387%2017.3727C0.959268%2016.8845%201.28047%2016.4649%201.69528%2016.1141C2.10995%2015.7634%202.61491%2015.4899%203.21%2015.2939C3.80509%2015.0979%204.47311%2015%205.21376%2015C5.88481%2015%206.51%2015.0842%207.08932%2015.2527C7.66864%2015.4212%208.17186%2015.6809%208.59926%2016.0315C9.02666%2016.3824%209.37637%2016.8328%209.64867%2017.3831C9.92082%2017.9334%2010.0887%2018.5797%2010.152%2019.3225H7.62582C7.58805%2018.9305%207.49459%2018.6004%207.34585%2018.3321C7.19697%2018.064%207.01177%2017.8491%206.79025%2017.6874C6.56845%2017.5258%206.31858%2017.4141%206.04006%2017.3521C5.76125%2017.2902%205.47318%2017.2592%205.17585%2017.2592C4.47311%2017.2592%203.92055%2017.4103%203.51862%2017.7124C3.11639%2018.0145%202.91557%2018.4264%202.91557%2018.9481C2.91557%2019.4972%203.07212%2019.9142%203.38608%2020.199C3.69947%2020.4842%204.17332%2020.7191%204.80704%2020.9044L7.0585%2021.5413C8.18459%2021.8654%209.03708%2022.3548%209.61597%2023.0096C10.1949%2023.6644%2010.4844%2024.5847%2010.4844%2025.7703C10.4844%2026.4306%2010.361%2027.0222%2010.1141%2027.5448C9.867%2028.0675%209.51729%2028.5111%209.06472%2028.8756C8.61199%2029.2401%208.07058%2029.5187%207.44076%2029.7111C6.8108%2029.9037%206.11906%2030%205.36582%2030C4.62489%2030%203.94124%2029.9158%203.31446%2029.7473C2.68769%2029.5788%202.13687%2029.3106%201.66201%2028.9425C1.18729%2028.5747%200.80402%2028.0983%200.513056%2027.5138C0.221659%2026.9293%200.0506401%2026.2209%200%2025.3886%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fg%3E%3Cg%20class%3D%22SiteHeader_logoLetter__tW243%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M17.1563%2024.4488V15H19.722V24.5647C19.722%2025.5126%2019.9453%2026.2589%2020.3922%2026.803C20.8392%2027.3473%2021.5094%2027.6193%2022.4033%2027.6193C23.3101%2027.6193%2023.9883%2027.3507%2024.4384%2026.8135C24.8885%2026.2764%2025.1134%2025.5268%2025.1134%2024.5647V15H27.6406V24.4488C27.6406%2025.2986%2027.5188%2026.0657%2027.2755%2026.7503C27.0318%2027.4351%2026.6843%2028.018%2026.2327%2028.499C25.7812%2028.9801%2025.2332%2029.3505%2024.5894%2029.6103C23.9455%2029.87%2023.2168%2030%2022.4033%2030C21.5866%2030%2020.8568%2029.87%2020.2139%2029.6103C19.5709%2029.3505%2019.0209%2028.9835%2018.5646%2028.5096C18.1079%2028.0355%2017.7592%2027.4561%2017.518%2026.7713C17.2771%2026.0867%2017.1563%2025.3125%2017.1563%2024.4488%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fg%3E%3Cg%20class%3D%22SiteHeader_logoLetter__tW243%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M34.3125%2029V15H39.6951C41.1065%2015%2042.1507%2015.3601%2042.8279%2016.0804C43.505%2016.8007%2043.8438%2017.9381%2043.8438%2019.4924C43.8438%2020.9732%2043.4672%2022.0904%2042.7141%2022.8442C41.9608%2023.598%2040.961%2023.9749%2039.7142%2023.9749H36.8378V29H34.3125V29ZM36.8378%2021.7136H39.9706C40.4134%2021.7136%2040.7314%2021.5965%2040.9245%2021.3619C41.1176%2021.1273%2041.214%2020.779%2041.214%2020.3167V18.588C41.214%2018.1191%2041.1239%2017.7824%2040.9436%2017.578C40.7632%2017.3736%2040.4388%2017.2714%2039.9706%2017.2714H36.8378V21.7136V21.7136Z%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fg%3E%3Cg%20class%3D%22SiteHeader_logoLetter__tW243%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M50.5156%2029V15H60.0469V17.2714H53.1622V20.7085H59.1116V22.9699H53.1622V26.7387H60.0469V29H50.5156%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fg%3E%3Cg%20class%3D%22SiteHeader_logoLetter__tW243%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M65.7656%2029V15H71.5711C73.0932%2015%2074.2193%2015.3534%2074.9498%2016.0602C75.6803%2016.7672%2076.0453%2017.8543%2076.0453%2019.3215C76.0453%2020.434%2075.7758%2021.3267%2075.2365%2022.0001C74.6972%2022.6733%2073.9464%2023.1407%2072.984%2023.4021L76.25%2029H73.2296L70.2297%2023.6232H68.4891V29H65.7656V29ZM68.4891%2021.4221H71.9294C72.7826%2021.4221%2073.2092%2020.9566%2073.2092%2020.0252V18.588C73.2092%2018.1191%2073.1153%2017.7824%2072.9276%2017.578C72.7398%2017.3736%2072.4071%2017.2714%2071.9294%2017.2714H68.4891V21.4221V21.4221Z%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M84.148%2024L81.0156%209.67576L83.5146%209.02091L84.8009%2014.9029L90.0143%2013.5367L88.7281%207.65484L91.227%207L94.3594%2021.3244L91.8605%2021.9791L90.5204%2015.8505L85.3067%2017.2165L86.647%2023.3453L84.148%2024%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M83.1063%2038L101.984%2036.2696L101.8%2034L82.9219%2035.7304L83.1063%2038%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M97.2712%2025.0988C97.4823%2024.3007%2098.2701%2023.8335%2099.0308%2024.055C99.7913%2024.2767%20100.237%2025.1033%20100.026%2025.9012C99.8144%2026.6993%2099.0267%2027.1665%2098.266%2026.945C97.5053%2026.7233%2097.0601%2025.8967%2097.2712%2025.0988%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M103.891%2014.7199L101.803%2022L99.125%2021.2799L101.213%2014L103.891%2014.7199%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%20!important%3B%22%2F%3E%3C%2Fsvg%3E"
,
  "favicon": "https://www.superhi.com/favicon.ico",
  "ogImage": "https://superhi.com/social-share-default.png"
}