# BrioHR Brand Identity

A complete profile of **BrioHR**'s visual system — colors, typography, components, and personality.

## Quick Facts

| Field    | Value |
|----------|-------|
| Primary  | #7EB4A1 |
| Accent   | #F86247 |
| Body Font| Inter |
| Heading Font| Merriweather |

## Color Palette

- primary: #7EB4A1
- secondary: #0089F7
- accent: #F86247
- background: #FFFFFF
- textPrimary: #F86247
- link: #F86247

## Typography

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

## Visual Assets

- Logo: 
- Favicon: 
- Social card (og:image):

## UI Components

- input: background=#FFE6A4, textColor=#246E53, borderColor=#2D6A4F, borderRadius=13px, shadow=rgba(0, 0, 0, 0.02) 0px 0px 2px 2px inset
- buttonPrimary: background=#F86247, textColor=#FFFFFF, borderRadius=30px, shadow=rgba(0, 0, 0, 0.03) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.07) 0px 4px 3px -2px inset
- buttonSecondary: background=#7EB4A1, textColor=#000000, borderColor=#7EB4A1, borderRadius=0px, shadow=none

## Brand Personality

Tone: professional · Energy: medium · Audience: business professionals seeking HR solutions

## BrioHR Brand in the Wild

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

- **AAL Shipping - Career page**  
  - Image:   
  - Source: [AAL Shipping Career Page](https://boards.briohr.com/aalshipping-38w9abcuvd)  
- **Accountability and Ownership: The Cornerstones of Business Success**  
  - Image:   
  - Source: [Business Success Article](https://briohr.com/blog/accountability-and-ownership-business-success/)  
- **HR News: Deferred Employment & Office Return, Aug 2022**  
  - Image:   
  - Source: [HR News Article](https://briohr.com/blog/august-2022-news-roundup/)  
- **How to Write a Job Description: Marketing Executive | BrioHR**  
  - Image:   
  - Source: [Job Description Article](https://briohr.com/blog/how-to-write-a-job-description-marketing-executive/)  
- **The Evolution and Imperative of Effective Communication Training for Managers | BrioHR**  
  - Image:   
  - Source: [Communication Training Article](https://briohr.com/blog/effective-communication-training-for-managers/)  
- **Transforming Productivity Measurement with HRMS Tools**  
  - Image:   
  - Source: [HRMS Tools Article](https://briohr.com/blog/hrms-tools/)

## Working with these fonts

Not found on Google Fonts? Follow these steps to obtain permission to use the fonts.

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.

## Machine-Readable Profile  
```json
{  
  "colorScheme": "light",  
  "fonts": [  
     {  
        "family": "Inter",  
        "role": "body"  
     },  
     {  
        "family": "Roboto",  
        "role": "body"  
     },  
     {  
        "family": "Merriweather",  
        "role": "heading"  
     },  
     {  
        "family": "Poppins",  
        "role": "heading"  
     }  
  ],  
  "colors": {  
     "primary": "#7EB4A1",  
     "secondary": "#0089F7",  
     "accent": "#F86247",  
     "background": "#FFFFFF",  
     "textPrimary": "#F86247",  
     "link": "#F86247"  
  },  
  "typography": {  
     "fontFamilies": {  
        "primary": "Inter",  
        "heading": "Merriweather"  
     },  
     "fontStacks": {  
        "heading": [  
           "Merriweather",  
           "serif"  
        ],  
        "body": [  
           "Poppins",  
           "Helvetica",  
           "Arial",  
           "sans-serif"  
        ],  
        "paragraph": [  
           "Inter",  
           "-apple-system",  
           "BlinkMacSystemFont",  
           "Segoe UI",  
           "Roboto",  
           "sans-serif"  
        ]  
     },  
     "fontSizes": {  
        "h1": "60px",  
        "h2": "40px",  
        "body": "18px"  
     }  
  },  
  "spacing": {  
     "baseUnit": 4,  
     "borderRadius": "5px"  
  },  
  "components": {  
     "input": {  
        "background": "#FFE6A4",  
        "textColor": "#246E53",  
        "borderColor": "#2D6A4F",  
        "borderRadius": "13px",  
        "borderRadiusCorners": {  
           "topLeft": "13px",  
           "topRight": "13px",  
           "bottomRight": "13px",  
           "bottomLeft": "13px"  
        },  
        "shadow": "rgba(0, 0, 0, 0.02) 0px 0px 2px 2px inset"  
     },  
     "buttonPrimary": {  
        "background": "#F86247",  
        "textColor": "#FFFFFF",  
        "borderRadius": "30px",  
        "borderRadiusCorners": {  
           "topLeft": "30px",  
           "topRight": "30px",  
           "bottomRight": "30px",  
           "bottomLeft": "30px"  
        },  
        "shadow": "rgba(0, 0, 0, 0.03) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.07) 0px 4px 3px -2px inset"  
     },  
     "buttonSecondary": {  
        "background": "#7EB4A1",  
        "textColor": "#000000",  
        "borderColor": "#7EB4A1",  
        "borderRadius": "0px",  
        "borderRadiusCorners": {  
           "topLeft": "0px",  
           "topRight": "0px",  
           "bottomRight": "0px",  
           "bottomLeft": "0px"  
        },  
        "shadow": "none"  
     }  
  },  
  "images": {  
     "logo": "https://briohr.com/wp-content/uploads/2022/02/Group-30.svg",  
     "favicon": "https://briohr.com/wp-content/uploads/2022/02/BrioHR-Favicon.png",  
     "ogImage": "https://briohr.com/wp-content/uploads/2022/05/Untitled-design-2022-05-31T110140.386.png",  
     "logoHref": "https://briohr.com",  
     "logoAlt": "Group 30"  
  },  
  "confidence": {  
     "buttons": 0.95,  
     "colors": 0.9,  
     "overall": 0.925  
  }  
}
```