MUUDS

Curated catalog of analyzed web design.

hipandflo-com

Quiet luxury meets classic sporting heritage. Sunlit clay court photography and warm stone surfaces frame elegant italic serif headlines, before transitioning into a disciplined, pitch-black technical product index.

Visit site

Colour

Background#ede9e4
Text#141414
Accent#254035
Surface#141414
Muted#bdb4af

Typefaces

Display
Instrument Serif
Body
Plus Jakarta Sans
Mono
Source
google
Scale
13 · 14 · 16 · 40 · 60 · 64

Layout

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

Capture

Category
other
Sections
15
Captured
2026-08-30
Rhythm
cream x7 → dark x5 → cream → dark

Type rules

  • display headlines set in italicized Instrument Serif with zero tracking
  • body text set in Plus Jakarta Sans at 16px with line-height 1.6 and 52 characters max measure
  • section titles and labels styled in sentence-case italic serif or quiet uppercase sans

Colour rules

  • warm stone cream (#ede9e4) serves as primary canvas for brand and narrative storytelling
  • deep carbon black (#141414) takes over for technical product and specification showcases
  • deep court green (#254035) appears as a singular full-bleed editorial block

Voice rules

  • use staccato three-word fragments to assert brand discipline
  • pair understated product claims with architectural vocabulary

Holds it together

  • pair every narrative block with sun-drenched lifestyle or tactile product photography
  • switch to deep dark (#141414) backgrounds exclusively when detailing technical product specifications
  • keep calls to action minimal and framed as solid black button rectangles

Contrast

text on background15.2:1 AAA
muted text on background1.7:1 fail
accent on background9.3:1 AAA
background on accent9.3:1 AAA

Type, measured

Body
16px / 1.6
Measure
52 characters
Display
64px / 1.1
Tracking
0em display
Scale ratio
1.41

Voice

Tone
refined, disciplined, restrained
Sentences
short
Person
third
Vocabulary
elevated
Calls to action
join

Built with

Builder
framer
Framework
Motion
WebGL
Nav
top_bar, 1 items
Length
11.4 screens

Sections in page order

15

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

  1. 00

    showcase

    Warm, sun-drenched lifestyle photograph of a padel player framed cleanly within a cream-toned editorial layout.

    Mood
    editorial + warm
    Layout
    2 col · centered · airy
    Open section →
    Warm, sun-drenched lifestyle photograph of a padel player framed cleanly within a cream-toned editorial layout.
  2. 01

    hero

    An upscale sports lifestyle hero combining sunlit court photography with graceful editorial typography on a warm stone-cream layout.

    Mood
    luxurious + editorial
    Layout
    12 col · split · airy
    Open section →
    An upscale sports lifestyle hero combining sunlit court photography with graceful editorial typography on a warm stone-cream layout.
  3. 02

    statement

    Quiet, editorial brand manifesto section set against warm cream with italic serif headlines and fragmented heritage photography.

    Mood
    quiet + editorial
    Layout
    1 col · asymmetric · airy
    Open section →
    Quiet, editorial brand manifesto section set against warm cream with italic serif headlines and fragmented heritage photography.
  4. 03

    feature

    A refined editorial split-panel pairing deep forest green brand philosophy with relaxed lifestyle photography against a warm cream backdrop.

    Mood
    editorial + luxurious
    Layout
    24 col · split · airy
    Open section →
    A refined editorial split-panel pairing deep forest green brand philosophy with relaxed lifestyle photography against a warm cream backdrop.
  5. 04

    feature

    Quiet editorial feature row pairing an elegant italic serif header with precise body copy and tactile product imagery.

    Mood
    quiet + editorial
    Layout
    1 col · split · airy
    Open section →
    Quiet editorial feature row pairing an elegant italic serif header with precise body copy and tactile product imagery.
  6. 05

    statement

    Warm editorial statement balancing an elegant italic serif headline against a clean mission statement and lifestyle tennis photography.

    Mood
    editorial + luxurious
    Layout
    4 col · asymmetric · airy
    Open section →
    Warm editorial statement balancing an elegant italic serif headline against a clean mission statement and lifestyle tennis photography.
  7. 06

    other

    An expansive, minimal warm-cream transition space punctuated only by the corner of a cropped photograph.

    Mood
    quiet
    Layout
    2 col · asymmetric · airy
    Open section →
    An expansive, minimal warm-cream transition space punctuated only by the corner of a cropped photograph.
  8. 07

    statement

    High-end athletic luxury combining sunlit court photography with an understated, elegant editorial statement block.

    Mood
    luxurious + editorial
    Layout
    16 col · stacked · airy
    Open section →
    High-end athletic luxury combining sunlit court photography with an understated, elegant editorial statement block.
  9. 08

    feature

    A refined, quiet luxury product feature with elegant italic serif typography and crisp studio photography against deep black.

    Mood
    luxurious + quiet
    Layout
    12 col · grid · airy
    Open section →
    A refined, quiet luxury product feature with elegant italic serif typography and crisp studio photography against deep black.
  10. 09

    showcase

    A quiet, dark luxury showcase pairing refined italic serif typography with precise technical copy and a clean product close-up.

    Mood
    luxurious + quiet
    Layout
    12 col · grid · airy
    Open section →
    A quiet, dark luxury showcase pairing refined italic serif typography with precise technical copy and a clean product close-up.
  11. 10

    feature

    An understated, luxurious dark editorial feature pairing delicate italic serif typography with sunlit athletic apparel photography.

    Mood
    luxurious + editorial
    Layout
    12 col · asymmetric · airy
    Open section →
    An understated, luxurious dark editorial feature pairing delicate italic serif typography with sunlit athletic apparel photography.
  12. 11

    statement

    Spacious, dark editorial band blending refined italic typography with quiet lifestyle photography for an understated luxury sportswear aesthetic.

    Mood
    luxurious + editorial
    Layout
    12 col · asymmetric · airy
    Open section →
    Spacious, dark editorial band blending refined italic typography with quiet lifestyle photography for an understated luxury sportswear aesthetic.
  13. 12

    showcase

    Quiet and disciplined luxury product showcase pairing elegant italic serif typography with minimalist studio tennis photography on deep black.

    Mood
    luxurious + quiet
    Layout
    12 col · split · airy
    Open section →
    Quiet and disciplined luxury product showcase pairing elegant italic serif typography with minimalist studio tennis photography on deep black.
  14. 13

    cta

    Sparse and quiet waitlist call-to-action set in an elegant italic serif surrounded by generous warm neutral space.

    Mood
    quiet + luxurious
    Layout
    1 col · centered · airy
    Open section →
    Sparse and quiet waitlist call-to-action set in an elegant italic serif surrounded by generous warm neutral space.
  15. 14

    footer

    A quiet, minimalist legal bar with clean uppercase typography and underlined links separating dark and cream background bands.

    Mood
    quiet
    Layout
    6 col · split · airy
    Open section →
    A quiet, minimalist legal bar with clean uppercase typography and underlined links separating dark and cream background bands.

More like this

by shared mood