# Haus Brand Identity

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

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

## Quick Facts

| Field | Value |
|---|---|
| Primary | #3BFAC0 |
| Accent | #3BFAC0 |
| Body Font | Ibmplexsans |
| Heading Font | Ibmplexsans |

## Color Palette

- primary: #3BFAC0
- secondary: #6B788C
- accent: #3BFAC0
- background: #FFFFFF
- textPrimary: #24262D
- link: #464F5E

## Typography

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

## Visual Assets

- Logo: data:image/svg+xml;utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20232%2080%22%20data-fc-idx%3D%220%22%3E%3Cpath%20d%3D%22M122.7%2035h-16.3V18.8H95.7v41.4h10.7V43.4h16.3v16.8h10.7V18.8h-10.7zm40.1-3.3q-3.6-3.2-10.3-3.2-4.2%200-7.3%201.4a13%2013%200%200%200-7.5%209.3h9.8q.4-1.6%201.7-2.6%201.4-1%203.5-1t3.3%201.2%201.2%203.2v.7a34%2034%200%200%201-8%201q-12.3.8-12.3%209.6%200%203%201.5%205.3%201.6%202.2%204%203.3%202.7%201.2%206%201.2%203%200%205-1a10%2010%200%200%200%203.7-2.7q.6-.8%201-.8.6%200%20.8%201l.4%202.6h7.1V41q0-6.1-3.6-9.4M157.2%2047q0%202.8-1%204.6a5%205%200%200%201-2.1%202q-1.4.7-3%20.7a5%205%200%200%201-3.3-1%203%203%200%200%201-1.2-2.6q0-1.5%201-2.3%201-1%203.4-1.1l6.2-1.1zm34.1-2q0%202-.4%203.4a7%207%200%200%201-1.2%202.3q-1.5%202-4.5%202-5%200-5-5.7V29.5h-9.5V49q0%205.9%203%209a11%2011%200%200%200%208.5%203.3q3%200%205-1%202.2-1%204-2.8l.7-.7q.3-.3.6-.2.8%200%201%201.2l.3%201.2.1%201.3h7V29.5h-9.6zm39.2%201.3a9%209%200%200%200-4-3.3q-2.6-1.2-7.1-2-2.9-.5-4-1.1a2%202%200%200%201-1-2.2q0-1.2.9-2%201-.7%202.6-.7%203.6%200%204%203.8h9.3a11%2011%200%200%200-4-7.7%2015%2015%200%200%200-9.5-2.6q-3.9%200-6.7%201.2-3%201.3-4.5%203.4a9%209%200%200%200-1.6%205.1q0%204.5%202.9%206.9%203%202.4%209.7%203.5%203%20.5%203.8%201.2%201%20.8%201%202.1t-1%202-2.9.8q-2.1%200-3.4-1a5%205%200%200%201-1.6-3H204q.7%205%204.5%207.7%203.9%202.8%2010%202.8%204%200%207-1.2%203-1.3%204.6-3.6a8%208%200%200%200%201.8-5.2q0-3-1.3-5M5.2%200A5%205%200%200%200%200%205.2v69.6a5.2%205.2%200%201%200%2010.4%200V5.2C10.4%202.3%208.1%200%205.2%200m13.9%2014a5%205%200%200%200-5.1%205v42a5.2%205.2%200%201%200%2010.4%200V19c0-2.9-2.3-5.2-5.2-5.2m31.2.2a5%205%200%200%200-5.2%205.1V61a5.2%205.2%200%201%200%2010.5%200V19c0-2.9-2.4-5.2-5.3-5.2M64.3%200a5%205%200%200%200-5.2%205.2v69.6a5.2%205.2%200%201%200%2010.5%200V5.2c0-2.9-2.4-5.2-5.3-5.2M34.8%2045.2a5.2%205.2%200%201%200%200-10.4%205.2%205.2%200%200%200%200%2010.4%22%20fill%3D%22currentColor%22%20style%3D%22fill%3A%20rgb(36%2C%2038%2C%2045)%20!important%3B%22%2F%3E%3C%2Fsvg%3E
- Favicon: https://cdn.prod.website-files.com/636c27cea6bf2a38e9eea317/671a7f45459a1a3ae4f71cbd_White%20on%20Cobalt_32x32.png
- Social card (og:image): https://cdn.prod.website-files.com/636c27cea6bf2a38e9eea317/698cc912d640157690a26208_og%20image%20-%20home%20-%201600.jpg

## UI Components

- input: background=transparent, textColor=#FFFFFF, borderColor=null, borderRadius=999px, shadow=none
- buttonPrimary: background=#3BFAC0, textColor=#24262D, borderRadius=999px, shadow=none
- buttonSecondary: background=transparent, textColor=#FFFFFF, borderRadius=999px, shadow=none

## Brand Personality

Tone: modern · Energy: medium · Audience: business professionals

## Haus Brand in the Wild

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

- **How Haus' Tom O'Bara helps billion-dollar enterprises with their biggest  marketing investment decisions**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/69b83653b9b18f7886542481_Haus%20x%20Sports%20Article.jpg
  - Source: https://www.haus.io/blog/how-haus-tom-obara-helps-billion-dollar-enterprises-with-their-biggest-marketing-investment-decisions
- **How Haus' Tom O'Bara helps billion-dollar enterprises with their biggest  marketing investment decisions**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/69ca8e73ef81e8ea801fb3dd_Spotlight%20-%20Tom%20OBara.png
  - Source: https://www.haus.io/blog/how-haus-tom-obara-helps-billion-dollar-enterprises-with-their-biggest-marketing-investment-decisions
- **The Incrementality Blog by Haus**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/691f9d0dd0ccae8e3d2df189_cAI%20blog%20tile.png
  - Source: https://www.haus.io/blog
- **Run Cleaner, More Accurate Holdout Tests with Haus Commuting Zones**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/686e767020e6074afbcc8a44_commuterzone.webp
  - Source: https://www.haus.io/blog/run-cleaner-more-accurate-holdout-tests-with-haus-commuting-zones
- **The Incrementality Blog by Haus**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/69dd28b7cfee72f7c9d9a2aa_Frame.png
  - Source: https://www.haus.io/blog
- **Haus Launches Fixed Geo Tests to Measure Billboards, Regional, and OOH  Activations**
  - Image: https://cdn.prod.website-files.com/63c00db03ecb8a822c829783/68596680e2a0a1426f316f9e_image%20(15).webp
  - Source: https://www.haus.io/blog/haus-launches-fixed-geo-tests-to-measure-billboards-regional-and-ooh-activations

## 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": "Ibmplexsans",
      "role": "body"
    }
  ],
  "colors": {
    "primary": "#3BFAC0",
    "secondary": "#6B788C",
    "accent": "#3BFAC0",
    "background": "#FFFFFF",
    "textPrimary": "#24262D",
    "link": "#464F5E"
  },
  "typography": {
    "fontFamilies": {
      "primary": "Ibmplexsans",
      "heading": "Ibmplexsans"
    },
    "fontStacks": {
      "heading": [
        "Ibmplexsans",
        "Arial",
        "sans-serif"
      ],
      "body": [
        "Ibmplexsans",
        "Arial",
        "sans-serif"
      ],
      "paragraph": [
        "Ibmplexsans",
        "Arial",
        "sans-serif"
      ]
    },
    "fontSizes": {
      "h1": "48px",
      "h2": "14px",
      "body": "14px"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "8px"
  },
  "components": {
    "input": {
      "background": "transparent",
      "textColor": "#FFFFFF",
      "borderColor": null,
      "borderRadius": "999px",
      "borderRadiusCorners": {
        "topLeft": "999px",
        "topRight": "999px",
        "bottomRight": "999px",
        "bottomLeft": "999px"
      },
      "shadow": "none"
    },
    "buttonPrimary": {
      "background": "#3BFAC0",
      "textColor": "#24262D",
      "borderRadius": "999px",
      "borderRadiusCorners": {
        "topLeft": "999px",
        "topRight": "999px",
        "bottomRight": "999px",
        "bottomLeft": "999px"
      },
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "transparent",
      "textColor": "#FFFFFF",
      "borderRadius": "999px",
      "borderRadiusCorners": {
        "topLeft": "999px",
        "topRight": "999px",
        "bottomRight": "999px",
        "bottomLeft": "999px"
      },
      "shadow": "none"
    }
  },
  "images": {
    "logo": "data:image/svg+xml;utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20232%2080%22%20data-fc-idx%3D%220%22%3E%3Cpath%20d%3D%22M122.7%2035h-16.3V18.8H95.7v41.4h10.7V43.4h16.3v16.8h10.7V18.8h-10.7zm40.1-3.3q-3.6-3.2-10.3-3.2-4.2%200-7.3%201.4a13%2013%200%200%200-7.5%209.3h9.8q.4-1.6%201.7-2.6%201.4-1%203.5-1t3.3%201.2%201.2%203.2v.7a34%2034%200%200%201-8%201q-12.3.8-12.3%209.6%200%203%201.5%205.3%201.6%202.2%204%203.3%202.7%201.2%206%201.2%203%200%205-1a10%2010%200%200%200%203.7-2.7q.6-.8%201-.8.6%200%20.8%201l.4%202.6h7.1V41q0-6.1-3.6-9.4M157.2%2047q0%202.8-1%204.6a5%205%200%200%201-2.1%202q-1.4.7-3%20.7a5%205%200%200%201-3.3-1%203%203%200%200%201-1.2-2.6q0-1.5%201-2.3%201-1%203.4-1.1l6.2-1.1zm34.1-2q0%202-.4%203.4a7%207%200%200%201-1.2%202.3q-1.5%202-4.5%202-5%200-5-5.7V29.5h-9.5V49q0%205.9%203%209a11%2011%200%200%200%208.5%203.3q3%200%205-1%202.2-1%204-2.8l.7-.7q.3-.3.6-.2.8%200%201%201.2l.3%201.2.1%201.3h7V29.5h-9.6zm39.2%201.3a9%209%200%200%200-4-3.3q-2.6-1.2-7.1-2-2.9-.5-4-1.1a2%202%200%200%201-1-2.2q0-1.2.9-2%201-.7%202.6-.7%203.6%200%204%203.8h9.3a11%2011%200%200%200-4-7.7%2015%2015%200%200%200-9.5-2.6q-3.9%200-6.7%201.2-3%201.3-4.5%203.4a9%209%200%200%200-1.6%205.1q0%204.5%202.9%206.9%203%202.4%209.7%203.5%203%20.5%203.8%201.2%201%20.8%201%202.1t-1%202-2.9.8q-2.1%200-3.4-1a5%205%200%200%201-1.6-3H204q.7%205%204.5%207.7%203.9%202.8%2010%202.8%204%200%207-1.2%203-1.3%204.6-3.6a8%208%200%200%200%201.8-5.2q0-3-1.3-5M5.2%200A5%205%200%200%200%200%205.2v69.6a5.2%205.2%200%201%200%2010.4%200V5.2C10.4%202.3%208.1%200%205.2%200m13.9%2014a5%205%200%200%200-5.1%205v42a5.2%205.2%200%201%200%2010.4%200V19c0-2.9-2.3-5.2-5.2-5.2m31.2.2a5%205%200%200%200-5.2%205.1V61a5.2%205.2%200%201%200%2010.5%200V19c0-2.9-2.4-5.2-5.3-5.2M64.3%200a5%205%200%200%200-5.2%205.2v69.6a5.2%205.2%200%201%200%2010.5%200V5.2c0-2.9-2.4-5.2-5.3-5.2M34.8%2045.2a5.2%205.2%200%201%200%200-10.4%205.2%205.2%200%200%200%200%2010.4%22%20fill%3D%22currentColor%22%20style%3D%22fill%3A%20rgb(36%2C%2038%2C%2045)%20!important%3B%22%2F%3E%3C%2Fsvg%3E",
    "favicon": "https://cdn.prod.website-files.com/636c27cea6bf2a38e9eea317/671a7f45459a1a3ae4f71cbd_White%20on%20Cobalt_32x32.png",
    "ogImage": "https://cdn.prod.website-files.com/636c27cea6bf2a38e9eea317/698cc912d640157690a26208_og%20image%20-%20home%20-%201600.jpg",
    "logoHref": "/"
  },
  "__llm_logo_reasoning": {
    "selectedIndex": 1,
    "reasoning": "Selected #0 because it is located in the header, links to the homepage, and matches the brand inferred from the URL and page title.",
    "confidence": 0.9,
    "source": "llm"
  },
  "__llm_button_reasoning": {
    "primary": {
      "index": 2,
      "text": "Get a Demo",
      "reasoning": "Button #2 uses the vibrant brand color #3BFAC0 and has action-oriented text 'Get a Demo', making it the primary CTA."
    },
    "secondary": {
      "index": 5,
      "text": "Previous case study",
      "reasoning": "Button #5 has a transparent background, differentiating it from the primary button's vibrant color, and serves as a secondary action with navigation text."
    },
    "confidence": 0.95
  },
  "personality": {
    "tone": "modern",
    "energy": "medium",
    "targetAudience": "business professionals"
  },
  "designSystem": {
    "framework": "custom",
    "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 located in the header, links to the homepage, and matches the brand inferred from the URL and page title.",
        "confidence": 0.9
      }
    },
    "buttonClassification": {
      "llmCalled": true,
      "llmSucceeded": true
    }
  }
}
```