SearchSubmit
MUUDS

Curated catalog of analyzed web design.

off-menu-com

Irreverent, confident, and delightfully surreal. Saturated periwinkle and deep black blocks collide with absurd 3D collages, paired with commanding geometric headlines that challenge conventional agency tropes.

playfulquietboldeditorialwarm
Visit site

Rated

7.0/ 10

From 12 analysed sections. Two measured components and one judged by a model. Distinction is a rank within the library; the rest are scores in their own right.

AI scorejudged
8.9
Systemmeasured
4.8
Distinctionmeasured
7.3
on the grid
33%
vertical rhythm
69%
type on a scale
50%
contrast passing AA
40%
unlike the library
0.26
model craft
7.7/10
model deviation
5.3/10

Colour

Background#41499e
Text#26272b
Accent#000000
Surface#f3efe9
Muted#f4efe9

Typefaces

Display
Avantt
Body
Akkurat
Mono
—
Source
adobe
Scale
14 · 16 · 18 · 26 · 34 · 40

Layout

Grid
—
Container
—
Spacing base
5px
Radius
20px

Capture

Category
agency
Sections
12
Captured
2026-08-30
Rhythm
periwinkle x2 → black x4 → cream x2 → periwinkle → cream → periwinkle

Type rules

  • display headlines set in massive geometric type with tight leading
  • body text set at 14px with relaxed 1.7 line height for high legibility
  • category badges and eyebrow tags always uppercase

Colour rules

  • distinct full-bleed color blocks alternate between periwinkle blue, pure black, and warm cream
  • interactive pills and buttons take contrasting solid fills of cream, black, or translucent white

Voice rules

  • conversational punchy language with zero corporate jargon
  • bold provocative statements followed by brief plain-spoken explanations

Holds it together

  • anchor major narrative sections with a single surreal 3D collage or tactile object cutout
  • group all actions and filter tags inside pill-shaped buttons with rounded geometries
  • alternate background themes completely across narrative shifts from blue to pitch black to warm cream

Contrast

text on background1.9:1 fail
muted text on background6.9:1 AA
text on surface13.0:1 AAA
accent on background2.7:1 fail
background on accent2.7:1 fail

Type, measured

Body
14px / 1.7
Measure
89 characters
Display
115px / 1
Tracking
-0.02em display
Scale ratio
1.69

Voice

Tone
provocative, confident, irreverent
Sentences
short
Person
first
Vocabulary
plain
Calls to action
get, view, explore, read, see

Built with

Builder
webflow
Framework
—
Motion
gsap
WebGL
—
Nav
sticky_top_bar, 12 items, sticky
Length
11.5 screens

Sections in page order

3 marked strong · 12

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

  1. 00

    hero

    Whimsical periwinkle hero with surreal 3D watermelon hot-air balloons and fluffy clouds floating around clean, centered typography.

    Mood
    playful + bold
    Layout
    1 col · centered · airy
    Open section →
    Whimsical periwinkle hero with surreal 3D watermelon hot-air balloons and fluffy clouds floating around clean, centered typography.
  2. 01

    logo bar

    A quiet, orderly grid of monochromatic partner logos resting evenly on a rich periwinkle field.

    Mood
    quiet + clinical
    Layout
    6 col · grid · balanced
    Open section →
    A quiet, orderly grid of monochromatic partner logos resting evenly on a rich periwinkle field.
  3. 02

    statement

    Strong

    Surreal and stark statement section pairing an oversized existential headline with a humorous three-eyed white cat against pitch black.

    Mood
    bold + playful
    Layout
    4 col · stacked · airy
    Open section →
    Surreal and stark statement section pairing an oversized existential headline with a humorous three-eyed white cat against pitch black.
  4. 03

    feature

    Dark, confident agency service breakdown framed by surreal floral eyeball collages and rounded category tags.

    Mood
    playful + bold
    Layout
    1 col · centered · balanced
    Open section →
    Dark, confident agency service breakdown framed by surreal floral eyeball collages and rounded category tags.
  5. 04

    statement

    A stark, confident statement section centered around massive geometric typography and a subtle pill CTA over a pure black canvas.

    Mood
    bold + quiet
    Layout
    1 col · centered · airy
    Open section →
    A stark, confident statement section centered around massive geometric typography and a subtle pill CTA over a pure black canvas.
  6. 05

    feature

    Monochrome, high-contrast dark section anchored by 3D metallic stars, clean editorial typography, and a stacked list of strategic inflection points.

    Mood
    bold + luxurious
    Layout
    1 col · centered · airy
    Open section →
    Monochrome, high-contrast dark section anchored by 3D metallic stars, clean editorial typography, and a stacked list of strategic inflection points.
  7. 06

    showcase

    Clean, warm-toned agency portfolio grid pairing tactile case study imagery with crisp serif titles and understated one-line descriptions.

    Mood
    editorial + warm
    Layout
    3 col · grid · balanced
    Open section →
    Clean, warm-toned agency portfolio grid pairing tactile case study imagery with crisp serif titles and understated one-line descriptions.
  8. 07

    testimonial

    Warm, clean masonry grid of rounded testimonial cards featuring characterful condensed typography and a solitary dark pill CTA.

    Mood
    warm + editorial
    Layout
    3 col · grid · balanced
    Open section →
    Warm, clean masonry grid of rounded testimonial cards featuring characterful condensed typography and a solitary dark pill CTA.
  9. 08

    cta

    Playful Y2K-inspired full-bleed marquee CTA banner combining cheeky cropped photography with quirky display typography.

    Mood
    playful + nostalgic
    Layout
    1 col · full bleed · balanced
    Open section →
    Playful Y2K-inspired full-bleed marquee CTA banner combining cheeky cropped photography with quirky display typography.
  10. 09

    faq

    Strong

    A quirky and warm FAQ layout paired with an absurd photo cutout of a dog emerging from a banana.

    Mood
    playful + warm
    Layout
    2 col · split · balanced
    Open section →
    A quirky and warm FAQ layout paired with an absurd photo cutout of a dog emerging from a banana.
  11. 10

    cta

    Vibrant periwinkle call-to-action featuring punchy expressive typography centered above a rounded pill button.

    Mood
    bold + playful
    Layout
    24 col · centered · airy
    Open section →
    Vibrant periwinkle call-to-action featuring punchy expressive typography centered above a rounded pill button.
  12. 11

    footer

    Strong

    Surreal and whimsical footer featuring a winged vintage car centered against a bold periwinkle field.

    Mood
    playful + nostalgic
    Layout
    4 col · stacked · airy
    Open section →
    Surreal and whimsical footer featuring a winged vintage car centered against a bold periwinkle field.

More like this

by shared mood