What font does Dwell use?

Dwell’s website uses two typefaces: Theinhardt (headings and body text), self-hosted; Noe Text, self-hosted.

What are Dwell’s brand colours?

The main colours on dwell.com are Royal Blue (#4558FF), Red (#FF3333), Teal (#0B8482), Salmon (#FF6666), Deep Blue (#122AFF) and Light Blue (#2C41FF).

What colour is Dwell’s text and background?

Body text is #2D2D2D on a #FFFFFF background.

Is this Dwell’s official style guide?

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

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

Unofficial style guide

Dwellstyle guide

Dwell’s website (dwell.com) uses Theinhardt for its headings and body text. Its palette is led by Royal Blue (#4558FF), Red (#FF3333) and Teal (#0B8482), with #2D2D2D text on #FFFFFF. Captured from the live site on 27 October 2026.

Website: dwell.com
Typefaces: Theinhardt, Noe Text
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 27 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

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

Screenshot of the dwell.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: Modern living, home design ideas, inspiration, and advice. - Dwell; ▲ 66 / 60 characters
Meta description: Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their homes to Dwell for inspiration, for sale, and for rent.; ▲ 193 / 160 characters
Site name: Dwell
og:title: Modern living, home design ideas, inspiration, and advice.
og:description: Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their homes to Dwell for inspiration, for sale, and for rent.

In search results

Dwellhttps://www.dwell.com/

Modern living, home design ideas, inspiration, and advice. - …

Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their homes to Dwell for insp…

When shared

dwell.com

Modern living, home design ideas, inspiration, and advice.

Dwell is the best place to design your modern home and apartment. Our community of professionals and design l…

Logo & favicons

No logo could be found on the homepage.

Logo

Favicons

8 found

152 px · PNG apple-touch-icon-precomposed
144 px · PNG apple-touch-icon-precomposed
120 px · PNG apple-touch-icon-precomposed
114 px · PNG apple-touch-icon-precomposed
72 px · PNG apple-touch-icon-precomposed
57 px · PNG apple-touch-icon-precomposed
32 px · ICO shortcut icon
32 px · PNG icon

Modern living, home design ideas, inspiration, and advice. - Dwell

Light browser tab

Modern living, home design ideas, inspiration, and advice. - Dwell

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 (#2D2D2D) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 31.8%
Charcoal 21.8%
Grey 11.8%
Light Grey 11.2%
Royal Blue 8.6%
Red 4.5%
Teal 3.5%
Salmon 2%
Deep Blue 0.9%
Light Blue 0.7%
Crimson 0.5%
Pale Violet Red 0.5%
Yellow Green 0.5%
Dodger Blue 0.5%
Gold 0.5%
Dark Cyan 0.5%

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
13.77:1 AAA

On white
—

Background, text, graphic · body, ._16N45MWF6pfJ7H9j4LeQan ._3q2Khb3EcTcFBeHEhiXGi4 button
Charcoal

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 82

On text
—

On white
13.77:1 AAA

Text, background, border · body, ._698WRMaxCCIyc15fm7Bqj ._3RXGDgqOFKz4dxpytbDiqg button._1YBRlIJRejNtFvzrmSpUnz
Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 40

On text
4.83:1 AA

On white
2.85:1 Fail

Text, graphic, background · ._36IjSSn25Df3eJlN8fx1QA h4, ._698WRMaxCCIyc15fm7Bqj ._3RXGDgqOFKz4dxpytbDiqg button
Light Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 20

On text
8.58:1 AAA

On white
1.61:1 Fail

Text, border, background · ._139HIkJn4OcWL2oiTtWrkz, button._14HN9rUlDk3zpYPuIs6QK2

Colours

Brand colours and accents, most used first

Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
73 65 0 0

On text
2.68:1 Fail

On white
5.13:1 AA

Text, background, border · button.mGYr9RB73yKMAe7aZwxGU, ._23v3cNayESiazF5630Aaq0 button
Red

HEX

RGB

HSL

OKLCH

CMYK
0 80 80 0

On text
3.79:1 AA large

On white
3.64:1 AA large

Text, background, border · ._2CrJxVnQDKnhwfftOzPP-F input._32yWqWAKYkUkKWfVY7BEQ2, ._3aw0IPWG8EMTtmBTJkJY_Z>div
Teal

HEX

RGB

HSL

OKLCH

CMYK
92 0 2 48

On text
3.04:1 AA large

On white
4.53:1 AA

Text, background, border · div._1kZ0G5Zh1S9hvWKjCtTAWX h4._3Tpzt_6Q7z1JOIQ3YK5RF6, .L1JjHJlKWm6AN6LgyZsf7._1Tvf_KkLiYdfSb3wx9fC7O ._2TR9R9lB7E2UJPz8Rn2ZFj button
Salmon

HEX

RGB

HSL

OKLCH

CMYK
0 60 60 0

On text
4.82:1 AA

On white
2.86:1 Fail

Background, text, graphic · ._2-UDSawWjMzu3VXcPTpQkD ._1sgT_X-26jcrEf0FR0LrMJ button .Xl_Zy1u0KYY3u5V-EIOny, ._2LyET0oTIDPpIKxfhKnRot button.HooMkJht7HI1LVnUILwkR span._3JYccDxlJWESvmMdt9Fl
Deep Blue

HEX

RGB

HSL

OKLCH

CMYK
93 84 0 0

On text
1.84:1 Fail

On white
7.50:1 AAA

Text, background · button.mGYr9RB73yKMAe7aZwxGU:hover, ._1VClpGFw3azZcJrnoeJd6F:hover ._13tJcithrPeLJUH8ybANBY._28NYV7LfXWR_k1Ec1f9Sla:
Light Blue

HEX

RGB

HSL

OKLCH

CMYK
83 75 0 0

On text
2.17:1 Fail

On white
6.35:1 AA

Background · ._23v3cNayESiazF5630Aaq0 button:hover, --button-hover-background-color
Crimson

HEX

RGB

HSL

OKLCH

CMYK
0 85 85 13

On text
2.84:1 Fail

On white
4.85:1 AA

Text, graphic · ._2CQ1TgP7tD-RLvfC-MBd-Y a[href^="/product"], ._3Q64cYzwtmOFyDnafPSpR3 tr:last-child td[colspan] b
Pale Violet Red

HEX

RGB

HSL

OKLCH

CMYK
0 46 26 32

On text
3.09:1 AA large

On white
4.45:1 AA large

Background, text · ._3VrgSNPLjjdUivIFCiESBd, .jyxhenkrnNlvxdDkNBaLG ._2V9-XP6E8FwpJQbsslfd16._3eXrOK5X8XRusvxtmM7Ro1
Yellow Green

HEX

RGB

HSL

OKLCH

CMYK
33 0 66 25

On text
6.19:1 AA

On white
2.22:1 Fail

Background, border, graphic · .mpFztMx6xvQx_y4joUcBn._1cSq-Sd0ByN5R8phDcHAxz, ._139HIkJn4OcWL2oiTtWrkz.dctDJAR-q7k3M1p1oqz8
Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
100 40 0 0

On text
4.59:1 AA

On white
3.00:1 AA large

Text, border · ._3yUNS48uTRbbVoV_JtgvHX, ._2SvQ5N8oWhS5En9hoES2t7
Gold

HEX

RGB

HSL

OKLCH

CMYK
0 21 84 0

On text
9.00:1 AAA

On white
1.53:1 Fail

Background, text · ._2AIQQbT3_u10LAcnnnKdj9 ._2IUp60RGjP84ub8Sv2_Vpm:before, ._2AIQQbT3_u10LAcnnnKdj9 ._3mg4BWzrYFRsGrVTjbIcnf
Dark Cyan

HEX

RGB

HSL

OKLCH

CMYK
92 0 2 39

On text
4.09:1 AA large

On white
3.37:1 AA large

Background, text · ._2ntseZ20AKh9ZwnkPSVe0S._2TKD__R3_Uz9hOjSHO_eF7:hover, ._3ibs-TYvhDviAcH05b1oa5 a:hover

Gradients

radial-gradient(center,circle,rgba(0,0,0,.25) 30%,transparent)
radial-gradient(circle at center,rgba(0,0,0,.25) 30%,transparent)
linear-gradient(right,#fff,hsla(0,0%,100%,.1))

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.

Theinhardt

Aa 400 Aa 700

Theinhardt

Self-hosted · weights 400, 500, 700 · headings, buttons, body · shown in a stand-in if you don’t have it

Aa 400 Aa 700

Noe Text

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

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

Type scale

From the site’s CSS

Body 1em · 16 px / 1.5 weight 400 · Theinhardt

Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their h…

Paragraph 18px / 1.25 weight 400 · Theinhardt

Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their h…

Small 14px weight 400

Dwell is the best place to design your modern home and apartment. Our community of professionals and design lovers share and upload their h…

Button 1em · 16 px / 1 weight 700 · Theinhardt

Get started

Link 13px / 1 weight 500 · uppercase · Theinhardt

Sizes in use

Most common across the site

24pxline 1.125 · 55 rules
20pxline 1.5 · 13 rules
18pxline 1.2222222222 · 70 rules
16pxline 1.25 · 109 rules
14pxline 1.25 · 198 rules
13pxline 20px · 31 rules
12pxline 1 · 77 rules
11pxline 1 · 27 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

button · #2D2D2D · radius 4px

Link

Read our latest news today.

a · #2D2D2D

Corner radius

4px · 58×
50% · 34×
6px · 29×
8px · 6×
3px · 6×
2px · 5×

Shadows

0 1px 2px rgba(0,0,0,.09),0 2px 6px rgba(0,0,0,.15)
0 0 1em rgba(0,0,0,.125)
2px 2px 2px 0 rgba(0,0,0,.1)
0 0 12px rgba(0,0,0,.25)

Layout

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

Grid

Breakpoints

320

375

480

640

768

960

1024

1025

On a scale of 0 to 1440 px.

Content widths (max-width)

1360 px

800 px

760 px

640 px

480 px

400 px

Notes

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

Notes

▲ CheckThe title is 66 characters. Google usually cuts titles near 60, so the end may not show in results.
▲ CheckThe description is 193 characters. Search results usually show about 160.
▲ CheckThe page doesn’t declare its language (the lang attribute on <html>).

Questions

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

Questions

What font does Dwell use?: Dwell’s website uses two typefaces: Theinhardt (headings and body text), self-hosted; Noe Text, self-hosted.
What are Dwell’s brand colours?: The main colours on dwell.com are Royal Blue (#4558FF), Red (#FF3333), Teal (#0B8482), Salmon (#FF6666), Deep Blue (#122AFF) and Light Blue (#2C41FF).
What colour is Dwell’s text and background?: Body text is #2D2D2D on a #FFFFFF background.
Is this Dwell’s official style guide?: No. SiteStyleGuide made it from dwell.com’s public web pages on 27 October 2026, and isn’t affiliated with Dwell. 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

dwell-com-tokens.css

Download

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

/* dwell.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/dwell.com) */
:root {
  /* Colours */
  --text: #2D2D2D;
  --background: #FFFFFF;
  --colour-white: #FFFFFF;
  --colour-charcoal: #2D2D2D;
  --colour-grey: #999999;
  --colour-light-grey: #CCCCCC;
  --colour-royal-blue: #4558FF;
  --colour-red: #FF3333;
  --colour-teal: #0B8482;
  --colour-salmon: #FF6666;
  --colour-deep-blue: #122AFF;
  --colour-light-blue: #2C41FF;
  --colour-crimson: #DD2222;
  --colour-pale-violet-red: #AE5E81;
  --colour-yellow-green: #80BF40;
  --colour-dodger-blue: #0099FF;
  --colour-gold: #FFCA28;
  --colour-dark-cyan: #0D9C99;
  --gradient-1: radial-gradient(center,circle,rgba(0,0,0,.25) 30%,transparent);
  --gradient-2: radial-gradient(circle at center,rgba(0,0,0,.25) 30%,transparent);
  --gradient-3: linear-gradient(right,#fff,hsla(0,0%,100%,.1));

  /* Typefaces */
  --font-headings: 'Theinhardt', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen-Sans';
  --font-buttons: 'Theinhardt', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen-Sans';
  --font-body: 'Theinhardt', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen-Sans';

  /* Type scale */
  --text-body: 1em;
  --leading-body: 1.5;
  --text-p: 18px;
  --leading-p: 1.25;
  --text-small: 14px;
  --text-button: 1em;
  --leading-button: 1;
  --text-a: 13px;
  --leading-a: 1;

  /* Shape */
  --radius-1: 4px;
  --radius-2: 50%;
  --radius-3: 6px;
  --radius-4: 8px;
  --radius-5: 3px;
  --radius-6: 2px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 320px;
  --breakpoint-2: 375px;
  --breakpoint-3: 480px;
  --breakpoint-4: 640px;
  --breakpoint-5: 768px;
  --breakpoint-6: 960px;
  --breakpoint-7: 1024px;
  --breakpoint-8: 1025px;
  --max-width-1: 1360px;
  --max-width-2: 800px;
  --max-width-3: 760px;
  --max-width-4: 640px;
  --max-width-5: 480px;
  --max-width-6: 400px;
}

{
    "site": "dwell.com",
    "source": "https://sitestyleguide.com/dwell.com",
    "text": "#2D2D2D",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Charcoal",
            "hex": "#2D2D2D",
            "rgb": [
                45,
                45,
                45
            ]
        },
        {
            "name": "Grey",
            "hex": "#999999",
            "rgb": [
                153,
                153,
                153
            ]
        },
        {
            "name": "Light Grey",
            "hex": "#CCCCCC",
            "rgb": [
                204,
                204,
                204
            ]
        },
        {
            "name": "Royal Blue",
            "hex": "#4558FF",
            "rgb": [
                69,
                88,
                255
            ]
        },
        {
            "name": "Red",
            "hex": "#FF3333",
            "rgb": [
                255,
                51,
                51
            ]
        },
        {
            "name": "Teal",
            "hex": "#0B8482",
            "rgb": [
                11,
                132,
                130
            ]
        },
        {
            "name": "Salmon",
            "hex": "#FF6666",
            "rgb": [
                255,
                102,
                102
            ]
        },
        {
            "name": "Deep Blue",
            "hex": "#122AFF",
            "rgb": [
                18,
                42,
                255
            ]
        },
        {
            "name": "Light Blue",
            "hex": "#2C41FF",
            "rgb": [
                44,
                65,
                255
            ]
        },
        {
            "name": "Crimson",
            "hex": "#DD2222",
            "rgb": [
                221,
                34,
                34
            ]
        },
        {
            "name": "Pale Violet Red",
            "hex": "#AE5E81",
            "rgb": [
                174,
                94,
                129
            ]
        },
        {
            "name": "Yellow Green",
            "hex": "#80BF40",
            "rgb": [
                128,
                191,
                64
            ]
        },
        {
            "name": "Dodger Blue",
            "hex": "#0099FF",
            "rgb": [
                0,
                153,
                255
            ]
        },
        {
            "name": "Gold",
            "hex": "#FFCA28",
            "rgb": [
                255,
                202,
                40
            ]
        },
        {
            "name": "Dark Cyan",
            "hex": "#0D9C99",
            "rgb": [
                13,
                156,
                153
            ]
        }
    ],
    "fonts": [
        {
            "name": "Theinhardt",
            "stack": "Theinhardt, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif",
            "weights": [
                400,
                500,
                700
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Noe Text",
            "stack": "Noe Text, Georgia, Cambria, Times New Roman, Times, serif",
            "weights": [
                400,
                500,
                700
            ],
            "source": "Self-hosted"
        }
    ]
}

Websites whose lead colour is closest to Dwell’s

WordPress.com

wp.me · 19 hours ago
Save
WordPress.org

wordpress.org · 1 day ago
Save
Interia

interia.pl · 20 hours ago
Save
Discord

discord.gg · 6 days ago
Save

Captured from dwell.com on 27 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Dwell; this guide describes the public website for reference.

Dwellstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Charcoal

Grey

Light Grey

Colours

Royal Blue

Red

Teal

Salmon

Deep Blue

Light Blue

Crimson

Pale Violet Red

Yellow Green

Dodger Blue

Gold

Dark Cyan

Gradients

Theinhardt

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run dwell.com?

Similar colours

WordPress.com

WordPress.org

Interia

Discord

Title &
description