Fast Font Downloads & Easy Licensing at Font Bros

<!-- Generated by ExtractVibe — https://extractvibe.com/brand/fontbros.com -->
<!-- Extracted: 2026-10-04T03:21:03.346Z | Schema: v1 | Quality: 65/100 -->
---
version: alpha
name: "Fast Font Downloads & Easy Licensing at Font Bros"
description: "Monster Mash Regular Font Style by Comicraft Fonts | Font Bros presents a professional web presence."
colors:
  primary: "#faa41d"
  tertiary: "#ff0000"
  neutral: "#a6a6a6"
  surface: "#d6d6d6"
  on-surface: "#212529"
  border: "#d6d6d6"
  link: "#faa41d"
typography:
  display-lg:
    fontFamily: "AvertaSemibold"
    fontSize: "38px"
    fontWeight: "700"
    lineHeight: "49.4px"
  headline-lg:
    fontFamily: "Averta"
    fontSize: "26px"
    fontWeight: "400"
    lineHeight: "33.8px"
  headline-md:
    fontFamily: "Averta"
    fontSize: "22px"
    fontWeight: "700"
    lineHeight: "28.6px"
    letterSpacing: "0.33px"
  headline-sm:
    fontFamily: "Averta"
    fontSize: "18px"
    fontWeight: "700"
    lineHeight: "23.4px"
  body-md:
    fontFamily: "Averta"
    fontSize: "18px"
    fontWeight: "400"
    lineHeight: "27px"
rounded:
  sm: "4px"
  md: "6px"
  lg: "8px"
  full: "9999px"
spacing:
  base: "2px"
  xs: "1px"
  sm: "2px"
  md: "4px"
  lg: "6px"
  xl: "8px"
components:
  button-primary:
    backgroundColor: "#faa41d"
    textColor: "#fefefa"
    rounded: "8px"
    padding: "20px 30px"
    fontSize: "24px"
    fontWeight: "700"
    borderColor: "#faa41d"
    borderWidth: "2px"
  button-ghost:
    textColor: "#000000"
    rounded: "4px"
    padding: "0px 8px 2px"
    fontSize: "16px"
    fontWeight: "400"
    borderColor: "#000000"
---

# Fast Font Downloads & Easy Licensing at Font Bros — Design System

## Overview

Monster Mash Regular Font Style by Comicraft Fonts | Font Bros presents a professional web presence.

Key characteristics: professional.

**Key characteristics:**

- Vibe — professional
- Design era — contemporary
- Emotional tone — professional
- Target audience — general audience
- Visual energy — 5/10 (moderate)

## Colors

The palette draws on 9 distinct colors observed across the site, organized into semantic roles below.

### Light mode

| Role | Hex | Name |
|------|-----|------|
| primary | `#faa41d` | Goldenrod |
| accent / tertiary | `#ff0000` | Red |
| surface | `#d6d6d6` | Light Gray |
| background | `#fefefa` | White |
| text | `#212529` | Near-Black |
| border | `#d6d6d6` | Light Gray |
| link | `#faa41d` | Goldenrod |
| muted | `#a6a6a6` | Dark Silver |

## Typography

Type is set in Averta, AvertaSemibold, Averta, with hierarchy expressed through size and weight contrast rather than family-switching.

### Font families

| Family | Role | Source | Weights |
|--------|------|--------|---------|
| Averta | body | self-hosted | 400, 700 |
| AvertaSemibold | heading | self-hosted | 700 |
| Averta | heading | self-hosted | 400, 700 |

### Type scale

| Role | Family | Size | Weight | Line height | Letter spacing |
|------|--------|------|--------|-------------|----------------|
| Display | AvertaSemibold | 38px | 700 | 49.4px | — |
| Heading 2 | Averta | 26px | 400 | 33.8px | — |
| Heading 3 | Averta | 22px | 700 | 28.6px | 0.33px |
| Heading 4 | Averta | 18px | 700 | 23.4px | — |
| Body | Averta | 18px | 400 | 27px | — |

### Conventions

- Heading case — title-case
- Body line-height — 27px

## Layout

- Base spacing unit — `2px`

## Shapes

Border-radius scale:

- `sm` — 4px
- `md` — 6px
- `lg` — 8px
- `full` — 9999px (pill / circular)

## Components

### Buttons

**Primary**

- Background — `#faa41d`
- Text — `#fefefa`
- Radius — `8px`
- Padding — `20px 30px`
- Font size — `24px`
- Font weight — `700`
- Border — `2px solid #faa41d`
- Sample copy — "Buy Font"

**Ghost**

- Text — `#000000`
- Radius — `4px`
- Padding — `0px 8px 2px`
- Font size — `16px`
- Font weight — `400`
- Border — ` solid #000000`
- Sample copy — "accent"

## Voice

### Tone (1–10 scale)

| Axis | Score | Lean |
|------|-------|------|
| Formal ↔ Casual | 5/10 | balanced |
| Playful ↔ Serious | 5/10 | balanced |
| Enthusiastic ↔ Matter-of-fact | 5/10 | balanced |
| Respectful ↔ Irreverent | 3/10 | respectful |
| Technical ↔ Accessible | 5/10 | balanced |

### Copywriting style

- Avg. sentence length — 12 words
- Vocabulary — moderate
- Jargon — some
- CTA style — direct

## Logos

| Type | Variant | Format | URL | Confidence |
|------|---------|--------|-----|------------|
| primary | — | svg | [link](https://img.loadlogo.com/fontbros.com) | 100% |
| favicon | — | ico | [link](brands/fontbros.com/logo-0.ico) | 95% |
| primary | — | svg | [link](brands/fontbros.com/logo-1.svg) | 85% |

## Sources

- Official brand guidelines — https://www.acquia.com/glossary/brand-identity-kit
- Live brand page — https://extractvibe.com/brand/fontbros.com
- Raw JSON — https://extractvibe.com/api/brand/fontbros.com
- DESIGN.md (this file) — https://extractvibe.com/api/brand/fontbros.com/design.md
- Extracted — 2026-10-04T03:21:03.346Z
- Generator — ExtractVibe vv1
- Quality score — 65/100

npx @google/design.md lint DESIGN.md
npx @google/design.md export --format tailwind DESIGN.md