SearchSubmit
MUUDS

Curated catalog of analyzed web design.

Designed by Paul

Brutalist editorial confidence executed with Swiss discipline. Towering ultra-condensed typography and stark black-and-white photography dominate a pitch-black canvas, allowing project case studies to provide the sole bursts of color.

boldrawluxuriousquieteditorialclinical
Visit site ↗

Colour

Background#141414
Text#ffffff
Surface#141414
Muted#ffffff

Typefaces

Display
PP Right Grotesk Tight Bold
Body
PP Neue Montreal Regular
Mono
—
Source
self_hosted
Scale
16 · 20 · 32 · 40 · 80 · 200

Layout

Grid
12 columns
Container
1320px
Spacing base
10px
Radius
0px

Capture

Category
portfolio
Sections
18
Captured
2026-08-27
Rhythm
dark x15 → light → dark x2

Type rules

  • display headlines set in ultra-condensed uppercase scaling up to 240px
  • body text in grotesque regular maintained at a narrow measure under 50 characters

Colour rules

  • strictly monochromatic canvas using white text on deep grey backgrounds
  • color is strictly reserved for embedded project imagery and media

Voice rules

  • headlines written in concise, uppercase declarations
  • subtitles and metadata placed in tight uppercase pairs

Holds it together

  • all display titles and section breaks must be set in ultra-condensed uppercase type
  • maintain strict monochromatic styling with no UI accent colors
  • pair massive typography directly with stark portraiture or 3D device mockups

Contrast

text on background18.4:1 AAA
muted text on background18.4:1 AAA
text on surface18.4:1 AAA

Type, measured

Body
20px / 1.2
Measure
47 characters
Display
200px / 0.8
Tracking
0em display
Scale ratio
1.78

Voice

Tone
declarative, confident, editorial
Sentences
short
Person
first
Vocabulary
curated
Calls to action
visit, contact

Built with

Builder
framer
Framework
—
Motion
—
WebGL
—
Nav
top_bar, 4 items
Length
16.1 screens

Colour, by area

#141414 0%#ffffff 0%

Sections in page order

3 strongest marked · 18

Rhythm — each block is a section, as wide as it is tall, in the colour it is on

  1. 00

    hero

    Monochromatic, high-impact portfolio hero pairing massive condensed typography with stark black-and-white portraiture.

    Mood
    bold + raw
    Layout
    12 col · stacked · dense
    Open section →
    Monochromatic, high-impact portfolio hero pairing massive condensed typography with stark black-and-white portraiture.
  2. 01

    hero

    Monolithic, ultra-condensed typography dominating a stark dark canvas creates an immediate, authoritative designer introduction.

    Mood
    bold + raw
    Layout
    12 col · stacked · balanced
    Open section →
    Monolithic, ultra-condensed typography dominating a stark dark canvas creates an immediate, authoritative designer introduction.
  3. 02

    showcase

    An intimate black-and-white portrait against fluted concrete creates a raw and arresting editorial presence.

    Mood
    raw + editorial
    Layout
    6 col · full bleed · airy
    Open section →
    An intimate black-and-white portrait against fluted concrete creates a raw and arresting editorial presence.
  4. 03

    statement

    A stark, monolithic dark section divider announcing portfolio work with towering condensed typography.

    Mood
    bold + raw
    Layout
    12 col · centered · airy
    Open section →
    A stark, monolithic dark section divider announcing portfolio work with towering condensed typography.
  5. 04

    showcase

    Dark and cinematic portfolio grid displaying client projects through sculptural 3D device mockups with stark studio lighting.

    Mood
    luxurious + quiet
    Layout
    10 col · grid · balanced
    Open section →
    Dark and cinematic portfolio grid displaying client projects through sculptural 3D device mockups with stark studio lighting.
  6. 05

    team

    Strongest

    Stark monochrome profile section dominated by towering condensed typography over a high-contrast black-and-white portrait.

    Mood
    bold + raw
    Layout
    12 col · stacked · airy
    Open section →
    Stark monochrome profile section dominated by towering condensed typography over a high-contrast black-and-white portrait.
  7. 06

    statement

    Monochromatic, high-impact typographic bio featuring ultra-condensed uppercase statements centered against a dark void.

    Mood
    bold + editorial
    Layout
    16 col · centered · airy
    Open section →
    Monochromatic, high-impact typographic bio featuring ultra-condensed uppercase statements centered against a dark void.
  8. 07

    gallery

    Minimal dark gallery presenting book photography with quiet asymmetry and restrained uppercase captions.

    Mood
    quiet + editorial
    Layout
    8 col · asymmetric · airy
    Open section →
    Minimal dark gallery presenting book photography with quiet asymmetry and restrained uppercase captions.
  9. 08

    statement

    A stark, minimalist profile section contrasting a condensed uppercase title with structured editorial bio copy on a dark canvas.

    Mood
    editorial + quiet
    Layout
    12 col · split · airy
    Open section →
    A stark, minimalist profile section contrasting a condensed uppercase title with structured editorial bio copy on a dark canvas.
  10. 09

    showcase

    Strongest

    Raw urban wheatpaste poster collage combining bold brand typography with sneaker culture photography under concrete bridge architecture.

    Mood
    raw + bold
    Layout
    12 col · full bleed · dense
    Open section →
    Raw urban wheatpaste poster collage combining bold brand typography with sneaker culture photography under concrete bridge architecture.
  11. 10

    statement

    Monolithic dark statement block presenting an oversized, condensed uppercase title with pure typographic focus.

    Mood
    bold + raw
    Layout
    12 col · centered · airy
    Open section →
    Monolithic dark statement block presenting an oversized, condensed uppercase title with pure typographic focus.
  12. 11

    statement

    Stark, minimalist dark section header presenting services with tight grotesque typography and generous negative space.

    Mood
    quiet + raw
    Layout
    12 col · asymmetric · airy
    Open section →
    Stark, minimalist dark section header presenting services with tight grotesque typography and generous negative space.
  13. 12

    showcase

    A stark dark-mode credentials and trust section structured with tight grotesque headlines in a systematic grid.

    Mood
    clinical + quiet
    Layout
    13 col · grid · airy
    Open section →
    A stark dark-mode credentials and trust section structured with tight grotesque headlines in a systematic grid.
  14. 13

    other

    A stark, completely unrendered white void with no discernible visual or typographical elements.

    Mood
    quiet
    Layout
    1 col · centered · airy
    Open section →
    A stark, completely unrendered white void with no discernible visual or typographical elements.
  15. 14

    other

    Strongest

    An offscreen or dynamically rendered dark content section utilizing dense typography.

    Mood
    quiet
    Layout
    1 col · grid · dense
    Open section →
    An offscreen or dynamically rendered dark content section utilizing dense typography.
  16. 15

    other

    An empty full-bleed container section functioning as a visual breathing space or placeholder.

    Mood
    quiet
    Layout
    12 col · full bleed · airy
    Open section →
    An empty full-bleed container section functioning as a visual breathing space or placeholder.
  17. 16

    footer

    A bold dark contact footer dominated by monumental condensed uppercase type and minimalist social links.

    Mood
    bold + quiet
    Layout
    12 col · stacked · airy
    Open section →
    A bold dark contact footer dominated by monumental condensed uppercase type and minimalist social links.
  18. 17

    footer

    An ultra-minimal, quiet dark footer stripped down to essential baseline utility and expansive whitespace.

    Mood
    quiet
    Layout
    12 col · grid · airy
    Open section →
    An ultra-minimal, quiet dark footer stripped down to essential baseline utility and expansive whitespace.

More like this

by shared mood