SearchSubmit
MUUDS

Curated catalog of analyzed web design.

buendigstudio-de

Warm, tactile, and architecturally structured. High-clarity Swiss grotesque typography pairs with delicate papercraft 3D models and soft peach surfaces to make complex B2B services feel approachable and methodically crafted.

warmeditorialquiet
Visit site

Colour

Background#fffdf9
Text#2b1911
Accent#ff8a48
Surface#fff0e5
Muted#67564d

Typefaces

Display
Instrument Sans
Body
Instrument Sans
Mono
—
Source
google
Scale
13 · 14 · 16 · 18 · 20 · 24

Layout

Grid
—
Container
—
Spacing base
4px
Radius
8px · 16px

Capture

Category
agency
Sections
16
Captured
2026-08-30
Rhythm
light x7 → dark → light x7 → dark

Type rules

  • display headlines use sentence case with key operative phrases set in italic
  • eyebrow categories set in uppercase with an orange bullet prefix
  • body text constrained to a 74-character measure with generous 1.6 line height

Colour rules

  • warm off-white #fffdf9 and soft peach #fff0e5 dominate the light card surfaces
  • deep espresso #2b1911 handles all core typography for soft, non-harsh contrast
  • terracotta orange #ff8a48 reserved strictly for primary action buttons and eyebrow bullets
  • dark chocolate #5a2508 appears as a single focal breakpoint section before the process

Voice rules

  • lead with the client's concrete operational problem before presenting solutions
  • state process steps with explicit milestone deliverables

Holds it together

  • use physical 3D papercraft and wireframe artwork to anchor abstract digital concepts
  • group explanatory points into distinct rounded cards with soft peach fill (#fff0e5)
  • highlight critical italicised words within large display headlines to direct emphasis
  • pair every high-level claim with structured multi-column scenario cards

Contrast

text on background16.5:1 AAA
muted text on background6.9:1 AA
text on surface15.1:1 AAA
accent on background2.3:1 fail
background on accent2.3:1 fail

Type, measured

Body
16px / 1.6
Measure
74 characters
Display
60px / 1.02
Tracking
-0.035em display
Scale ratio
1.39

Voice

Tone
clarifying, consultative, structured
Sentences
medium
Person
second
Vocabulary
professional
Calls to action
einordnen, ansehen, besprechen

Built with

Builder
framer
Framework
—
Motion
—
WebGL
—
Nav
sticky_top_bar, 6 items, sticky
Length
19.9 screens

Sections in page order

16

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

  1. 00

    hero

    Warm, architectural studio hero pairing a clean editorial typographic hierarchy with a tactile papercraft 3D cityscape illustration.

    Mood
    warm + editorial
    Layout
    2 col · split · airy
    Open section →
    Warm, architectural studio hero pairing a clean editorial typographic hierarchy with a tactile papercraft 3D cityscape illustration.
  2. 01

    feature grid

    A warm, structured feature row using soft peachy tones and clean white cards to convey directness and trust.

    Mood
    warm + quiet
    Layout
    4 col · grid · balanced
    Open section →
    A warm, structured feature row using soft peachy tones and clean white cards to convey directness and trust.
  3. 02

    feature grid

    Clean typographic section outlining common client scenarios using a split layout with structured neutral cards.

    Mood
    warm + editorial
    Layout
    4 col · split · balanced
    Open section →
    Clean typographic section outlining common client scenarios using a split layout with structured neutral cards.
  4. 03

    feature grid

    Calm and warm corporate feature section using soft peach cards on an off-white background to structure stakeholder benefits.

    Mood
    warm + quiet
    Layout
    2 col · grid · balanced
    Open section →
    Calm and warm corporate feature section using soft peach cards on an off-white background to structure stakeholder benefits.
  5. 04

    showcase

    Structured editorial project showcase pairing disciplined Swiss typography with soft peach card containers.

    Mood
    editorial + warm
    Layout
    2 col · stacked · balanced
    Open section →
    Structured editorial project showcase pairing disciplined Swiss typography with soft peach card containers.
  6. 05

    feature grid

    Warm, tactile bento grid presenting web design services with delicate paper-craft 3D structural mockups.

    Mood
    warm + editorial
    Layout
    2 col · grid · balanced
    Open section →
    Warm, tactile bento grid presenting web design services with delicate paper-craft 3D structural mockups.
  7. 06

    comparison

    Warm, restrained two-card service model comparison with clean grotesque typography on a soft peach background.

    Mood
    warm + quiet
    Layout
    2 col · grid · balanced
    Open section →
    Warm, restrained two-card service model comparison with clean grotesque typography on a soft peach background.
  8. 07

    feature grid

    Warm chocolate-brown informational section featuring white content cards that outline search optimization capabilities.

    Mood
    warm + editorial
    Layout
    3 col · stacked · balanced
    Open section →
    Warm chocolate-brown informational section featuring white content cards that outline search optimization capabilities.
  9. 08

    feature grid

    Quiet and warm editorial feature grid explaining an AI workflow through soft cream cards, clean typography, and spacious layouts.

    Mood
    warm + quiet
    Layout
    3 col · stacked · airy
    Open section →
    Quiet and warm editorial feature grid explaining an AI workflow through soft cream cards, clean typography, and spacious layouts.
  10. 09

    feature

    An airy, warm-toned split layout explaining a four-phase process with numbered milestones and clean typography.

    Mood
    quiet + warm
    Layout
    2 col · split · airy
    Open section →
    An airy, warm-toned split layout explaining a four-phase process with numbered milestones and clean typography.
  11. 10

    team

    An intimate, warm boutique agency team section with soft earth tones and paired founder portraits.

    Mood
    warm + quiet
    Layout
    2 col · split · airy
    Open section →
    An intimate, warm boutique agency team section with soft earth tones and paired founder portraits.
  12. 11

    feature grid

    A calm and warm typographic breakdown of project scoping parameters arranged across two soft rounded cards.

    Mood
    warm + clinical
    Layout
    12 col · stacked · balanced
    Open section →
    A calm and warm typographic breakdown of project scoping parameters arranged across two soft rounded cards.
  13. 12

    cta

    Tactile and thoughtful split CTA pairing physical UI wireframing photography with a warm rounded content panel.

    Mood
    warm + editorial
    Layout
    2 col · split · balanced
    Open section →
    Tactile and thoughtful split CTA pairing physical UI wireframing photography with a warm rounded content panel.
  14. 13

    faq

    A calm, warm-toned FAQ section using softly tinted cards to present comprehensive project questions clearly.

    Mood
    warm + quiet
    Layout
    1 col · stacked · balanced
    Open section →
    A calm, warm-toned FAQ section using softly tinted cards to present comprehensive project questions clearly.
  15. 14

    other

    A quiet, tactile paper collage canvas layered with soft directional shadows, ribbed textures, and delicate translucent sheets.

    Mood
    quiet + editorial
    Layout
    1 col · asymmetric · airy
    Open section →
    A quiet, tactile paper collage canvas layered with soft directional shadows, ribbed textures, and delicate translucent sheets.
  16. 15

    footer

    Minimal, tactile footer area blending architectural fluting and torn paper textures with understated typography.

    Mood
    quiet + warm
    Layout
    8 col · stacked · airy
    Open section →
    Minimal, tactile footer area blending architectural fluting and torn paper textures with understated typography.

More like this

by shared mood