What font does Brickify My Home use?

Brickify My Home’s website uses three typefaces: Bricolage Grotesque (headings and body text), self-hosted; JetBrains Mono, self-hosted; Figtree, self-hosted.

What are Brickify My Home’s brand colours?

The main colours on brickifymyhome.com are Midnight Blue (#1F2B45), Light Sienna (#C4502B), Deep Sienna (#A8401F), Light Sea Green (#5E9A6E), Fire Brick (#B3261E) and Misty Rose (#F6DCCF).

What colour is Brickify My Home’s text and background?

Body text is #1F2B45 on a #F4EFE6 background.

Where is Brickify My Home’s logo from?

The logo shown in this guide was found on brickifymyhome.com’s homepage. For official logo files and usage rules, check Brickify My Home’s own brand or press page.

Is this Brickify My Home’s official style guide?

No. SiteStyleGuide made it from brickifymyhome.com’s public web pages on 21 October 2026, and isn’t affiliated with Brickify My Home. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from brickifymyhome.com’s public web pages. Not affiliated with or endorsed by Brickify My Home. The real site is brickifymyhome.com ↗

Unofficial style guide

Brickify My Homestyle guide

Brickify My Home’s website (brickifymyhome.com) uses Bricolage Grotesque for its headings and body text. Its palette is led by Midnight Blue (#1F2B45), Light Sienna (#C4502B) and Deep Sienna (#A8401F), with #1F2B45 text on #F4EFE6. Captured from the live site on 21 October 2026.

Website: brickifymyhome.com
Typefaces: Bricolage Grotesque, JetBrains Mono, Figtree
Palette: 4 neutrals, 12 colours, 1 gradient
Captured: 21 Oct 2026 · added by @milesb

Save2 Add to collection Share Report

Screenshot of the brickifymyhome.com homepage on a desktop screen — Screenshot of brickifymyhome.com on a 1440 px desktop screen, 21 Oct 2026.

Screenshot of the brickifymyhome.com homepage on a phone — On a phone, 390 px.

Identity & metadata

What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.

Title &
description

Page title: Brickify My Home: your home, built in bricks; ● 44 / 60 characters
Meta description: Upload your house plans, CAD files or a few photos. We turn your home into a custom brick model with a 3D preview, step-by-step instructions and every part delivered to your door.; ▲ 179 / 160 characters
Site name: Brickify My Home
og:title: Your home, in bricks
og:description: Upload your plans or a few photos. We design the model, pick every part and ship the bricks to your door.
Language: en-AU
Theme colour: #F4EFE6

In search results

Brickify My Homehttps://brickifymyhome.com/

Brickify My Home: your home, built in bricks

Upload your house plans, CAD files or a few photos. We turn your home into a custom brick model with a 3D preview, step-by-step instructions and every part deliv…

When shared

The image Brickify My Home shares with links

brickifymyhome.com

Your home, in bricks

Upload your plans or a few photos. We design the model, pick every part and ship the bricks to your door.

Logo & favicons

Found as: image in the header. SVG, 600 × 91.

Logo

On white

On black

On Midnight Blue

Favicons

6 found

512 px · PNG manifest
512 px · PNG manifest
192 px · PNG manifest
180 px · PNG apple-touch-icon
64 px · SVG icon
48 px · ICO icon

Brickify My Home: your home, built in bricks

Light browser tab

Brickify My Home: your home, built in bricks

Dark browser tab

Colour

Read from the site’s stylesheets and weighted by where each colour is used. Names are the nearest standard colour name. Click a swatch to copy its hex code.

Contrast is against the site’s text colour (#1F2B45) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

Midnight Blue 19.2%
White 15.8%
Cool Dark Grey 14.4%
Light Warm Off White 13.5%
Light Sienna 9.8%
Deep Warm Off White 4.5%
Deep Sienna 3.8%
Light Sea Green 3.4%
Fire Brick 3%
Misty Rose 3%
Steel Blue 2.3%
Coral 2.1%
Rebecca Purple 1.9%
Golden Rod 1.3%
Dark Slate Blue 1.1%
Deep Sea Green 0.9%

By how often each colour appears in the site’s CSS, weighted by where (body, headings, buttons), not by area on the screen.

Neutrals

Text, backgrounds and structure

White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
14.10:1 AAA

On white
—

Background, text, border · .btn-secondary, .menu-btn
Cool Dark Grey

HEX

RGB

HSL

OKLCH

CMYK
20 13 0 53

On text
2.51:1 Fail

On white
5.63:1 AA

Text · .hero-note, .file-list button
Light Warm Off White

HEX

RGB

HSL

OKLCH

CMYK
0 2 6 4

On text
12.31:1 AAA

On white
1.15:1 Fail

Background, text, theme · body, .site-header
Deep Warm Off White

HEX

RGB

HSL

OKLCH

CMYK
0 3 9 8

On text
11.05:1 AAA

On white
1.28:1 Fail

Background · .compare, .upload

Colours

Brand colours and accents, most used first

Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
55 38 0 73

On text
—

On white
14.10:1 AAA

Text, background, border · body, .hero-video
Light Sienna

HEX

RGB

HSL

OKLCH

CMYK
0 59 78 23

On text
3.04:1 AA large

On white
4.64:1 AA

Background, border, graphic · .btn-primary, .btn .studs i
Deep Sienna

HEX

RGB

HSL

OKLCH

CMYK
0 62 82 34

On text
2.29:1 Fail

On white
6.14:1 AA

Text, background · .hero h1 .accent, a
Light Sea Green

HEX

RGB

HSL

OKLCH

CMYK
39 0 29 40

On text
4.24:1 AA large

On white
3.32:1 AA large

Background · .hero-note span::before, inline style on <span>
Fire Brick

HEX

RGB

HSL

OKLCH

CMYK
0 79 83 30

On text
2.16:1 Fail

On white
6.54:1 AA

Text · .file-list button:hover, .contact-form .err
Misty Rose

HEX

RGB

HSL

OKLCH

CMYK
0 11 16 4

On text
10.78:1 AAA

On white
1.31:1 Fail

Background · .dropzone.drag, .file-list .kind
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
61 29 0 23

On text
3.93:1 AA large

On white
3.59:1 AA large

Background · inline style on <span>, .step:nth-child(2) .num
Coral

HEX

RGB

HSL

OKLCH

CMYK
0 48 64 11

On text
4.63:1 AA

On white
3.04:1 AA large

Used · --brand, --brand-text
Rebecca Purple

HEX

RGB

HSL

OKLCH

CMYK
11 44 0 45

On text
2.25:1 Fail

On white
6.26:1 AA

Background · inline style on <span>, .step:nth-child(4) .num
Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 26 74 11

On text
6.62:1 AA

On white
2.13:1 Fail

Background · --brick-ochre, inline style on <span>
Dark Slate Blue

HEX

RGB

HSL

OKLCH

CMYK
42 30 0 69

On text
1.21:1 Fail

On white
11.68:1 AAA

Border · --line, .legal
Deep Sea Green

HEX

RGB

HSL

OKLCH

CMYK
50 0 33 55

On text
2.51:1 Fail

On white
5.62:1 AA

Text · .plan li svg, --success

Gradients

linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, #C4502B 18%, transparent) 6px 8px)

Typography

Faces from Google Fonts are shown in the real thing. Others are licensed to the site, so they show in your device’s copy if you have one, or a stand-in if not.

Bricolage Grotesque

Aa 700 Aa 800

Bricolage Grotesque

Self-hosted · weights 700, 800 · headings · shown in a stand-in if you don’t have it

Aa 500

JetBrains Mono

Self-hosted · weights 500 · shown in a stand-in if you don’t have it

Aa 400 Aa 700

Figtree

Self-hosted · weights 400, 600, 700 · shown in a stand-in if you don’t have it

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”

Type scale

From the site’s CSS

Heading 1 clamp(48px, 7.4vw, 88px) · 88 px / .94 weight 800 · Bricolage Grotesque

Brickify My Home

Heading 2 26px / 32px weight 800 · Bricolage Grotesque

Brickify My Home: your home, built in bricks

Heading 3 24px / 30px weight 800

Brickify My Home: your home, built in bricks

Heading 4 12px / 16px uppercase

Brickify My Home: your home, built in bricks

Body 16px / 24px

Upload your house plans, CAD files or a few photos. We turn your home into a custom brick model with a 3D preview, step-by-step instruction…

Paragraph 15px / 22px

Upload your house plans, CAD files or a few photos. We turn your home into a custom brick model with a 3D preview, step-by-step instruction…

Small 14px / 20px

Upload your house plans, CAD files or a few photos. We turn your home into a custom brick model with a 3D preview, step-by-step instruction…

Link 15px weight 600

Sizes in use

Most common across the site

88pxline .94 · 1 rules
48pxline 1.04 · 1 rules
26pxline 32px · 2 rules
22pxline 28px · 2 rules
18pxline 28px · 1 rules
15pxline 22px · 9 rules
14pxline 20px · 9 rules
13pxline 20px · 5 rules

Elements

The main button and link as the site’s CSS draws them, and the corner radii and shadows it uses most.

Elements

Button

Get started

.btn-primary · #C4502B

Link

Read our latest news today.

a · #A8401F

Corner radius

8px · 12×
4px · 11×
16px · 8×
3px · 3×
999px · 3×
2px 2px 0 0 · 2×

Shadows

0 3px 0 rgba(31, 43, 69, .16)
0 3px 0 rgba(31, 43, 69, .16), 0 12px 24px -12px rgba(31, 43, 69, .25)
0 0 0 1px rgba(31,43,69,.25)
18px 0 0 0 currentColor

Layout

Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.

Grid

Breakpoints

420

560

720

880

900

920

960

1060

On a scale of 0 to 1440 px.

Content widths (max-width)

820 px

640 px

544 px

520 px

512 px

480 px

Notes

Plain checks on what was found. Worth fixing if you look after this site.

Notes

● FineThe title is 44 characters, short enough to show in full in search results.
▲ CheckThe description is 179 characters. Search results usually show about 160.

Questions

Quick answers, from the same capture as the rest of this guide.

Questions

What font does Brickify My Home use?: Brickify My Home’s website uses three typefaces: Bricolage Grotesque (headings and body text), self-hosted; JetBrains Mono, self-hosted; Figtree, self-hosted.
What are Brickify My Home’s brand colours?: The main colours on brickifymyhome.com are Midnight Blue (#1F2B45), Light Sienna (#C4502B), Deep Sienna (#A8401F), Light Sea Green (#5E9A6E), Fire Brick (#B3261E) and Misty Rose (#F6DCCF).
What colour is Brickify My Home’s text and background?: Body text is #1F2B45 on a #F4EFE6 background.
Where is Brickify My Home’s logo from?: The logo shown in this guide was found on brickifymyhome.com’s homepage. For official logo files and usage rules, check Brickify My Home’s own brand or press page.
Is this Brickify My Home’s official style guide?: No. SiteStyleGuide made it from brickifymyhome.com’s public web pages on 21 October 2026, and isn’t affiliated with Brickify My Home. Members can refresh a guide after 90 days to pick up changes.

Design tokens

Everything above as CSS variables, ready to paste into a project. Members can download the tokens as files for Figma (Tokens Studio), Style Dictionary and Tailwind.

Tokens

brickifymyhome-com-tokens.css

Download

Free with an account: sign up or sign in, and you’ll come straight back here.

/* brickifymyhome.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/brickifymyhome.com) */
:root {
  /* Colours */
  --text: #1F2B45;
  --background: #F4EFE6;
  --colour-white: #FFFFFF;
  --colour-cool-dark-grey: #5F6877;
  --colour-light-warm-off-white: #F4EFE6;
  --colour-deep-warm-off-white: #EAE3D6;
  --colour-midnight-blue: #1F2B45;
  --colour-light-sienna: #C4502B;
  --colour-deep-sienna: #A8401F;
  --colour-light-sea-green: #5E9A6E;
  --colour-fire-brick: #B3261E;
  --colour-misty-rose: #F6DCCF;
  --colour-steel-blue: #4C8CC4;
  --colour-coral: #E27552;
  --colour-rebecca-purple: #7C4F8C;
  --colour-golden-rod: #E3A73A;
  --colour-dark-slate-blue: #2E3850;
  --colour-deep-sea-green: #3A734D;
  --gradient-1: linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, #C4502B 18%, transparent) 6px 8px);

  /* Typefaces */
  --font-headings: 'Bricolage Grotesque', 'Figtree', system-ui, sans-serif;
  --font-other: 'JetBrains Mono', ui-monospace, 'Menlo', monospace;

  /* Type scale */
  --text-h1: clamp(48px, 7.4vw, 88px);
  --leading-h1: .94;
  --text-h2: 26px;
  --leading-h2: 32px;
  --text-h3: 24px;
  --leading-h3: 30px;
  --text-h4: 12px;
  --leading-h4: 16px;
  --text-body: 16px;
  --leading-body: 24px;
  --text-p: 15px;
  --leading-p: 22px;
  --text-small: 14px;
  --leading-small: 20px;
  --text-a: 15px;

  /* Shape */
  --radius-1: 8px;
  --radius-2: 4px;
  --radius-3: 16px;
  --radius-4: 3px;
  --radius-5: 999px;
  --radius-6: 2px 2px 0 0;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 420px;
  --breakpoint-2: 560px;
  --breakpoint-3: 720px;
  --breakpoint-4: 880px;
  --breakpoint-5: 900px;
  --breakpoint-6: 920px;
  --breakpoint-7: 960px;
  --breakpoint-8: 1060px;
  --max-width-1: 820px;
  --max-width-2: 640px;
  --max-width-3: 544px;
  --max-width-4: 520px;
  --max-width-5: 512px;
  --max-width-6: 480px;
}

{
    "site": "brickifymyhome.com",
    "source": "https://sitestyleguide.com/brickifymyhome.com",
    "text": "#1F2B45",
    "background": "#F4EFE6",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Cool Dark Grey",
            "hex": "#5F6877",
            "rgb": [
                95,
                104,
                119
            ]
        },
        {
            "name": "Light Warm Off White",
            "hex": "#F4EFE6",
            "rgb": [
                244,
                239,
                230
            ]
        },
        {
            "name": "Deep Warm Off White",
            "hex": "#EAE3D6",
            "rgb": [
                234,
                227,
                214
            ]
        },
        {
            "name": "Midnight Blue",
            "hex": "#1F2B45",
            "rgb": [
                31,
                43,
                69
            ]
        },
        {
            "name": "Light Sienna",
            "hex": "#C4502B",
            "rgb": [
                196,
                80,
                43
            ]
        },
        {
            "name": "Deep Sienna",
            "hex": "#A8401F",
            "rgb": [
                168,
                64,
                31
            ]
        },
        {
            "name": "Light Sea Green",
            "hex": "#5E9A6E",
            "rgb": [
                94,
                154,
                110
            ]
        },
        {
            "name": "Fire Brick",
            "hex": "#B3261E",
            "rgb": [
                179,
                38,
                30
            ]
        },
        {
            "name": "Misty Rose",
            "hex": "#F6DCCF",
            "rgb": [
                246,
                220,
                207
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#4C8CC4",
            "rgb": [
                76,
                140,
                196
            ]
        },
        {
            "name": "Coral",
            "hex": "#E27552",
            "rgb": [
                226,
                117,
                82
            ]
        },
        {
            "name": "Rebecca Purple",
            "hex": "#7C4F8C",
            "rgb": [
                124,
                79,
                140
            ]
        },
        {
            "name": "Golden Rod",
            "hex": "#E3A73A",
            "rgb": [
                227,
                167,
                58
            ]
        },
        {
            "name": "Dark Slate Blue",
            "hex": "#2E3850",
            "rgb": [
                46,
                56,
                80
            ]
        },
        {
            "name": "Deep Sea Green",
            "hex": "#3A734D",
            "rgb": [
                58,
                115,
                77
            ]
        }
    ],
    "fonts": [
        {
            "name": "Bricolage Grotesque",
            "stack": "\"Bricolage Grotesque\", \"Figtree\", system-ui, sans-serif",
            "weights": [
                700,
                800
            ],
            "source": "Self-hosted"
        },
        {
            "name": "JetBrains Mono",
            "stack": "\"JetBrains Mono\", ui-monospace, Menlo, monospace",
            "weights": [
                500
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Figtree",
            "stack": "\"Figtree\", system-ui, -apple-system, \"Segoe UI\", sans-serif",
            "weights": [
                400,
                600,
                700
            ],
            "source": "Self-hosted"
        }
    ]
}

Websites whose lead colour is closest to Brickify My Home’s

trello.com

trello.com · 23 hours ago
Save
expedia

expedia.co.uk · 3 days ago
Save
vrbo

vrbo.com · 4 days ago
Save
amzn.com

amzn.com · 23 hours ago
Save

Captured from brickifymyhome.com on 21 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Brickify My Home; this guide describes the public website for reference.

Brickify My Homestyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Cool Dark Grey

Light Warm Off White

Deep Warm Off White

Colours

Midnight Blue

Light Sienna

Deep Sienna

Light Sea Green

Fire Brick

Misty Rose

Steel Blue

Coral

Rebecca Purple

Golden Rod

Dark Slate Blue

Deep Sea Green

Gradients

Bricolage Grotesque

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run brickifymyhome.com?

Similar colours

trello.com

expedia

vrbo

amzn.com

Title &
description