Quilt Brand Identity

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

Quick Facts

Color Palette

• primary: #FF7B5E
• secondary: #7FEBF9
• accent: #000000
• background: #FEF9F3
• textPrimary: #000000
• link: #FFF8EF

Typography

• primary: Quilt Sans — Google Fonts
• heading: Quilt Serif — Google Fonts

Visual Assets

• Logo: %20!important%3B%22%2F%3E%0A%3C%2Fsvg%3E)
• Favicon:
• Social card (og:image):

UI Components

• input: background=#3A3A3A, textColor=#FFFFFF, borderColor=#6A6A6A, borderRadius=12px, shadow=none
• buttonPrimary: background=#000000, textColor=#FFFFFF, borderRadius=9999px, shadow=none
• buttonSecondary: background=transparent, textColor=#000000, borderColor=#000000, borderRadius=9999px, shadow=none

Brand Personality

Tone: modern · Energy: medium · Audience: homeowners interested in smart home technology

Quilt Brand in the Wild

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

• Quilt – HVAC Professionals

  Source: Link

• Quilt – How heat pump rebates work in the Bay Area

  Source: Link

• Quilt – The smartest way to heat and cool your home

  Source: Link

• Quilt – This milestone belongs to you: Quilt raises $20M Series B

  Source: Link

Working with these 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

{
 "colorScheme": "light",
 "fonts": [
  {
   "family": "Quilt Sans",
   "role": "body"
  },
  {
   "family": "Quilt Serif",
   "role": "heading"
  },
  {
   "family": "Arial",
   "role": "unknown"
  },
  {
   "family": "Georgia",
   "role": "unknown"
  }
 ],
 "colors": {
  "primary": "#FF7B5E",
  "secondary": "#7FEBF9",
  "accent": "#000000",
  "background": "#FEF9F3",
  "textPrimary": "#000000",
  "link": "#FFF8EF"
 },
 "typography": {
  "fontFamilies": {
   "primary": "Quilt Sans",
   "heading": "Quilt Serif"
  },
  "fontStacks": {
   "heading": [
    "Quilt Sans",
    "Arial",
    "sans-serif"
   ],
   "body": [
    "Quilt Sans",
    "Arial",
    "sans-serif"
   ],
   "paragraph": [
    "Quilt Sans",
    "Arial",
    "sans-serif"
   ]
  },
  "fontSizes": {
   "h1": "21.008px",
   "h2": "21.008px",
   "body": "24px"
  }
 },
 "spacing": {
  "baseUnit": 4,
  "borderRadius": "12px"
 },
 "components": {
  "input": {
   "background": "#3A3A3A",
   "textColor": "#FFFFFF",
   "borderColor": "#6A6A6A",
   "borderRadius": "12px",
   "shadow": "none"
  },
  "buttonPrimary": {
   "background": "#000000",
   "textColor": "#FFFFFF",
   "borderRadius": "9999px",
   "shadow": "none"
  },
  "buttonSecondary": {
   "background": "transparent",
   "textColor": "#000000",
   "borderColor": "#000000",
   "borderRadius": "9999px",
   "shadow": "none"
  }
 },
 "images": {
  "logo": "data:image/svg+xml;utf8,%3Csvg%20width%3D%2262%22%20height%3D%2222%22%20viewBox%3D%220%200%2062%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20data-fc-idx%3D%220%22%3E%0A%3Cpath%20d%3D%22M22.1791%2018.9495V21.7107H10.891C4.37476%2021.7107%200%2016.7306%200%2010.591C0%204.4515%204.76725%200%2010.4928%200C16.7646%200%2021.1393%204.7249%2021.1393%2010.9246C21.1393%2015.1696%2018.867%2018.8225%2013.5214%2018.8225C15.8086%2017.4124%2017.0779%2014.3165%2017.0779%2010.6421C17.0779%205.60068%2014.5715%201.75837%2010.557%201.75837C6.54264%201.75837%204.03507%205.60068%204.03507%2010.6421C4.03507%2016.194%206.56674%2019.8162%2011.7827%2019.8162C15.2417%2019.8162%2022.1779%2018.9495%2022.1779%2018.9495H22.1791ZM29.1383%2021.9989C31.2706%2021.9989%2033.023%2020.2984%2034.1041%2019.1424V21.7096H37.4345V6.86897H34.1041V17.1912C33.1986%2018.5774%2031.8249%2019.1117%2030.2481%2019.1117C28.4956%2019.1117%2027.5018%2018.1305%2027.5018%2016.3687V6.86897H24.1714V17.004C24.1714%2020.0363%2025.9536%2022%2029.1372%2022L29.1383%2021.9989ZM40.7512%204.14407H44.3065V0.629609H40.7512V4.14407ZM44.1941%2021.7107V6.86897H40.8636V21.7107H44.1941ZM50.9513%2021.7107V0.629609H47.6209V21.7107H50.9513ZM57.7453%2019.6529V9.4101H61.2857V7.43959H57.7453V2.73851H54.3862V17.6971C54.3862%2020.4118%2056.0227%2021.7107%2058.4178%2021.7107H61.2834V19.2762L57.7453%2019.6529Z%22%20fill%3D%22currentColor%22%20style%3D%22fill%3A%20rgb(0%2C%200%2C%200)%20!important%3B%22%2F%3E%0A%3C%2Fsvg%3E",
  "favicon": "https://www.quilt.com/dist/images/favicon.ico",
  "ogImage": "https://quilt-pumps.transforms.svdcdn.com/production/general/Full-Width/Quilt_Bedroom1_1.jpg?w=1200&h=630&q=82&auto=format&fit=crop&dm=1719611452&s=118956806c2523eb86a17710c5c6f9e5",
  "logoHref": "/"
 },
 "personality": {
  "tone": "modern",
  "energy": "medium",
  "targetAudience": "homeowners interested in smart home technology"
 },
 "designSystem": {
  "framework": "tailwind",
  "componentLibrary": ""
 },
 "confidence": {
  "buttons": 0.9,
  "colors": 0.9,
  "overall": 0.9
 }
}