MUUDS

Curated catalog of analyzed web design.

Salt and Bits

Quiet and tactile. Deep warm black anchors the page, broken up by earthy stone and cream portfolio frames displaying textured editorial imagery.

Visit site

Colour

Background#171514
Text#f7f5f0
Accent#929687
Surface#faf8f4
Muted#b4a493

Typefaces

Display
Poppins-Variable
Body
Poppins-Variable
Mono
Source
self_hosted
Scale
11 · 13 · 23

Layout

Grid
10 columns
Container
1382px
Spacing base
5px
Radius
0px

Capture

Category
agency
Sections
14
Captured
2026-08-29
Rhythm
dark → light → mixed → dark → light → dark → mixed → dark x3 → light → dark → mixed → dark

Type rules

  • body text set at 13px with generous 1.78 line-height
  • headlines kept small and delicate at 23px sentence case
  • nav and labels uppercase tracked

Colour rules

  • near-black dark background sets the core tone
  • warm stone, sand, and cream panels punctuate dark grid cells

Voice rules

  • understated descriptions focused on craft and materiality
  • minimal verbal friction with direct links

Holds it together

  • pair tactile physical imagery with dark negative space
  • keep typography restrained and delicate without oversized display scales
  • use full-bleed asymmetric image grids with clean edge alignments

Contrast

text on background16.7:1 AAA
muted text on background7.5:1 AAA
text on surface1.0:1 fail
accent on background6.0:1 AA
background on accent6.0:1 AA

Type, measured

Body
13px / 1.78
Measure
72 characters
Display
23px / 1.48
Tracking
0.006em display
Scale ratio
1.15

Voice

Tone
restrained, refined
Sentences
medium
Person
third
Vocabulary
curated
Calls to action
contact

Built with

Builder
Framework
Motion
WebGL
Nav
top_bar, 5 items
Length
9.5 screens

Sections in page order

3 marked strong · 14

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

  1. 00

    hero

    A moody, dark split hero pairing tactile volcanic rock photography with restrained studio typography and generous negative space.

    Mood
    quiet + raw
    Layout
    16 col · split · airy
    Open section →
    A moody, dark split hero pairing tactile volcanic rock photography with restrained studio typography and generous negative space.
  2. 01

    feature

    Warm and refined culinary feature section pairing delicate typography and generous cream space with close-up food photography.

    Mood
    luxurious + warm
    Layout
    5 col · split · airy
    Open section →
    Warm and refined culinary feature section pairing delicate typography and generous cream space with close-up food photography.
  3. 02

    showcase

    Strong

    Quiet, minimal split showcase pairing deep black space with warm editorial stationery photography.

    Mood
    quiet + luxurious
    Layout
    10 col · split · airy
    Open section →
    Quiet, minimal split showcase pairing deep black space with warm editorial stationery photography.
  4. 03

    showcase

    Minimalist portfolio showcase staging a studio desktop screen within warm, cinematic lighting and deep dark negative space.

    Mood
    quiet + editorial
    Layout
    10 col · asymmetric · airy
    Open section →
    Minimalist portfolio showcase staging a studio desktop screen within warm, cinematic lighting and deep dark negative space.
  5. 04

    cta

    A restrained, gallery-like consultation form paired with austere architectural kitchen photography on a generous off-white canvas.

    Mood
    quiet + luxurious
    Layout
    12 col · split · airy
    Open section →
    A restrained, gallery-like consultation form paired with austere architectural kitchen photography on a generous off-white canvas.
  6. 05

    showcase

    Quiet, moody device showcase framed by dramatic natural shadows and warm wooden textures.

    Mood
    quiet + luxurious
    Layout
    10 col · centered · airy
    Open section →
    Quiet, moody device showcase framed by dramatic natural shadows and warm wooden textures.
  7. 06

    showcase

    Strong

    An understated, serene portfolio preview balancing tactile brand mockups with airy architectural vignettes across a wide horizontal canvas.

    Mood
    quiet + luxurious
    Layout
    10 col · asymmetric · airy
    Open section →
    An understated, serene portfolio preview balancing tactile brand mockups with airy architectural vignettes across a wide horizontal canvas.
  8. 07

    showcase

    Dramatic chiaroscuro studio photography showcases a mobile portfolio held against deep, enveloping darkness.

    Mood
    quiet + luxurious
    Layout
    10 col · asymmetric · airy
    Open section →
    Dramatic chiaroscuro studio photography showcases a mobile portfolio held against deep, enveloping darkness.
  9. 08

    showcase

    A serene, architecturally minded showcase contrasting clean editorial print layouts with moody desktop mockups in natural light.

    Mood
    quiet + editorial
    Layout
    10 col · asymmetric · airy
    Open section →
    A serene, architecturally minded showcase contrasting clean editorial print layouts with moody desktop mockups in natural light.
  10. 09

    showcase

    A quiet, tactile showcase placing a mobile device mockup within a deep, textured black space.

    Mood
    quiet + luxurious
    Layout
    10 col · asymmetric · airy
    Open section →
    A quiet, tactile showcase placing a mobile device mockup within a deep, textured black space.
  11. 10

    showcase

    Quiet architectural case study laid out like an art monograph, pairing a disciplined text column with expansive landscape photography.

    Mood
    quiet + editorial
    Layout
    10 col · split · airy
    Open section →
    Quiet architectural case study laid out like an art monograph, pairing a disciplined text column with expansive landscape photography.
  12. 11

    showcase

    Somber, tactile branding showcase featuring embossed stationery resting on rough earthen ground beside a solid dark void.

    Mood
    quiet + luxurious
    Layout
    10 col · split · airy
    Open section →
    Somber, tactile branding showcase featuring embossed stationery resting on rough earthen ground beside a solid dark void.
  13. 12

    showcase

    Strong

    An airy, minimalist architectural showcase pairing asymmetric project photography with high-contrast tactile branding imagery on a split canvas.

    Mood
    quiet + editorial
    Layout
    10 col · asymmetric · airy
    Open section →
    An airy, minimalist architectural showcase pairing asymmetric project photography with high-contrast tactile branding imagery on a split canvas.
  14. 13

    showcase

    A quiet, atmospheric showcase displaying a physical desktop mockup inside precise hairline grid borders.

    Mood
    quiet + editorial
    Layout
    10 col · centered · airy
    Open section →
    A quiet, atmospheric showcase displaying a physical desktop mockup inside precise hairline grid borders.