# Humi Brand Identity

A complete profile of **Humi**'s visual system — colors, typography, components, and personality — extracted from [http://www.humi.ca](http://www.humi.ca/). Built for designers, agents, and AI tools.

## Color Palette

Brand palette extracted from http://www.humi.ca.

| Color       | Hex Code | RGB                |
|-------------|----------|-------------------|
| Primary     | #7622D7  | rgb(118, 34, 215) |
| Secondary   | #460078  | rgb(70, 0, 120)   |
| Accent      | #7622D7  | rgb(118, 34, 215) |
| Background  | #FFFFFF  | rgb(255, 255, 255)|
| Text Primary| #422358  | rgb(66, 35, 88)   |
| Link        | #422358  | rgb(66, 35, 88)   |

## Typography

Each font links to its Google Fonts page where available.

| Role    | Font         | Link                                      |
|---------|--------------|-------------------------------------------|
| Primary | DM Sans      | [Google Fonts →](https://fonts.google.com/specimen/DM+Sans) |
| Heading | DM Sans      | [Google Fonts →](https://fonts.google.com/specimen/DM+Sans) |

## Visual Assets

Logo

Favicon

Social Card

## UI Components

Live previews rendered using Humi's actual button styles.

| Component          | Background  | Text Color | Border Color | Border Radius | Shadow |
|--------------------|-------------|------------|--------------|---------------|--------|
| Input               | #FFFFFF     | #000000    | null         | 0px           | none   |
| Button Primary      | #7622D7     | #FFFFFF    | #7622D7      | 32px          | none   |
| Button Secondary    | #FFFFFF     | #000000    | null         | 0px           | none   |

## Brand Personality

**Tone:** professional  
**Energy:** medium  
**Audience:** business professionals and HR departments

## Frequently Asked Questions

**What is Humi's primary brand color?**  
Humi's primary brand color is #7622D7. It anchors the visual identity across their website, product UI, and marketing materials.

**What font does Humi use?**  
Humi uses DM Sans as the primary typeface across body and headings.

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

**Where can I find Humi's logo?**  
Humi's logo is available directly on their site (http://www.humi.ca). 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 http://www.humi.ca 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 Humi.

## Methodology

Brand data on this page was extracted from [http://www.humi.ca](http://www.humi.ca/) on 2026-07-27 using the [Firecrawl](https://firecrawl.dev/) branding extraction API, which inspects each site's live CSS, font network requests, color tokens, and component styles.

## Machine-Readable Profile

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

```json
{
  "colorScheme": "light",
  "fonts": [
    {
      "family": "DM Sans",
      "role": "body"
    }
  ],
  "colors": {
    "primary": "#7622D7",
    "secondary": "#460078",
    "accent": "#7622D7",
    "background": "#FFFFFF",
    "textPrimary": "#422358",
    "link": "#422358"
  },
  "typography": {
    "fontFamilies": {
      "primary": "DM Sans",
      "heading": "DM Sans"
    },
    "fontStacks": {
      "heading": [
        "Saiga",
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Oxygen-Sans",
        "Ubuntu",
        "Cantarell",
        "Helvetica Neue",
        "sans-serif"
      ],
      "body": [
        "DM Sans",
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Oxygen-Sans",
        "Ubuntu",
        "Cantarell",
        "Helvetica Neue",
        "sans-serif"
      ],
      "paragraph": [
        "DM Sans",
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Oxygen-Sans",
        "Ubuntu",
        "Cantarell",
        "Helvetica Neue",
        "sans-serif"
      ]
    },
    "fontSizes": {
      "h1": "80px",
      "h2": "42px",
      "body": "16px"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "8px"
  },
  "components": {
    "input": {
      "background": "#FFFFFF",
      "textColor": "#000000",
      "borderColor": null,
      "borderRadius": "0px",
      "borderRadiusCorners": {
        "topLeft": "0px",
        "topRight": "0px",
        "bottomRight": "0px",
        "bottomLeft": "0px"
      },
      "shadow": "none"
    },
    "buttonPrimary": {
      "background": "#7622D7",
      "textColor": "#FFFFFF",
      "borderColor": "#7622D7",
      "borderRadius": "32px",
      "borderRadiusCorners": {
        "topLeft": "32px",
        "topRight": "32px",
        "bottomRight": "32px",
        "bottomLeft": "32px"
      },
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "#FFFFFF",
      "textColor": "#000000",
      "borderRadius": "0px",
      "borderRadiusCorners": {
        "topLeft": "0px",
        "topRight": "0px",
        "bottomRight": "0px",
        "bottomLeft": "0px"
      },
      "shadow": "none"
    }
  },
  "images": {
    "logo": "https://employmenthero.com/en-ca/wp-content/uploads/sites/6/2025/05/eh-logo.png",
    "favicon": "https://employmenthero.com/en-ca/wp-content/uploads/sites/6/2025/08/cropped-EH_Favicon-LightViolet-32x32.png",
    "ogImage": "https://employmenthero.com/ca/wp-content/uploads/sites/6/2025/07/default-social-image.png",
    "logoHref": "https://employmenthero.com/en-ca/",
    "logoAlt": "Employment Hero Canada"
  },
  "personality": {
    "tone": "professional",
    "energy": "medium",
    "targetAudience": "business professionals and HR departments"
  },
  "designSystem": {
    "framework": "bootstrap",
    "componentLibrary": ""
  }
}
```