MUUDS

Curated catalog of analyzed web design.

sakazuki-io

An austere and tactile collision of Japanese craftsmanship and digital brutalism. Expansive warm stone voids create meditative stillness before plunging into saturated lacquer-red and pitch-black blocks driven by monumental fractured typography.

Visit site

Rated

7.3/ 10

From 17 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
9.0
Systemmeasured
4.7
Distinctionmeasured
9.5
on the grid
33%
vertical rhythm
54%
type on a scale
67%
contrast passing AA
33%
unlike the library
0.31
model craft
7.7/10
model deviation
7.0/10

Colour

Background#e1d6ce
Text#000000
Accent#c30d23
Surface#000000
Muted#e1d6ce

Typefaces

Display
hagrid
Body
hagrid-text
Mono
Source
adobe
Scale
11 · 14 · 15 · 17 · 21 · 30

Layout

Grid
Container
Spacing base
8px
Radius
0px

Capture

Category
food
Sections
17
Captured
2026-08-31
Rhythm
sand x5 → black x3 → crimson → black → sand → crimson x3 → black → sand x2

Type rules

  • display typography rendered at monumental scales with negative letterspacing and vertical syllable breaks
  • body text set in hagrid-text at 17px with a line length around 69 characters

Colour rules

  • warm sand (#e1d6ce) dominates as the quiet contemplative base
  • lacquer red (#c30d23) and pitch black (#000000) serve as full-bleed chapter resets

Voice rules

  • frame physical craft and heritage through digital metaphors
  • use aphoristic declarations before introducing product details

Holds it together

  • let massive sand-toned whitespace breathe around isolated, contemplative copy blocks
  • use saturated crimson containers with chevron-style cutout shapes to stage featured artifacts
  • break headline words across vertical lines at monumental scales

Contrast

text on background14.7:1 AAA
accent on background4.3:1 AA Large
background on accent4.3:1 AA Large

Type, measured

Body
17px / 1.4
Measure
69 characters
Display
317px / 0.8
Tracking
-0.02em display
Scale ratio
2.08

Voice

Tone
philosophical, poetic, exclusive
Sentences
medium
Person
first
Vocabulary
elevated
Calls to action
mint

Built with

Builder
Framework
next
Motion
WebGL
yes
Nav
top_bar, 10 items
Length
28.2 screens

Sections in page order

3 marked strong · 17

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

  1. 00

    hero

    Grounded editorial hero pairing earthy ceramic tones and organic macro photography with kinetic brutalist typography.

    Mood
    grounded + mysterious
    Layout
    1 col · stacked · airy
    Open section →
    Grounded editorial hero pairing earthy ceramic tones and organic macro photography with kinetic brutalist typography.
  2. 01

    hero

    A serene and spacious typographic statement set in crisp white against a calming, warm sand canvas.

    Mood
    serene + luxurious
    Layout
    1 col · centered · airy
    Open section →
    A serene and spacious typographic statement set in crisp white against a calming, warm sand canvas.
  3. 02

    statement

    A quiet, contemplative field of warm beige where centered white text invites a slow, meditative read before revealing the section title below.

    Mood
    contemplative + serene
    Layout
    2 col · stacked · airy
    Open section →
    A quiet, contemplative field of warm beige where centered white text invites a slow, meditative read before revealing the section title below.
  4. 03

    statement

    Strong

    Vast, warm minimal void punctuated only by subtle editorial text in opposing top corners.

    Mood
    serene + contemplative
    Layout
    16 col · split · airy
    Open section →
    Vast, warm minimal void punctuated only by subtle editorial text in opposing top corners.
  5. 04

    other

    A quiet, expansive void of warm stone beige resting above a stark black horizon.

    Mood
    serene + contemplative
    Layout
    12 col · stacked · airy
    Open section →
    A quiet, expansive void of warm stone beige resting above a stark black horizon.
  6. 05

    statement

    Monumental split typography anchors a stark, black-and-cream editorial statement divided by a sharp crimson geometric ribbon.

    Mood
    luxurious + mysterious
    Layout
    3 col · asymmetric · airy
    Open section →
    Monumental split typography anchors a stark, black-and-cream editorial statement divided by a sharp crimson geometric ribbon.
  7. 06

    statement

    Strong

    Raw, fractured typography slices across stark black space with a bold geometric red divider.

    Mood
    rebellious + mysterious
    Layout
    1 col · stacked · airy
    Open section →
    Raw, fractured typography slices across stark black space with a bold geometric red divider.
  8. 07

    feature

    Monochrome, stark brutalist artist bio driven by monumental sans typography and a stark black backdrop.

    Mood
    rebellious + contemplative
    Layout
    16 col · split · airy
    Open section →
    Monochrome, stark brutalist artist bio driven by monumental sans typography and a stark black backdrop.
  9. 08

    feature

    A bold crimson container framed by architectural cutouts pairs cinematic tasting photography with restrained editorial typography to convey rare craftsmanship.

    Mood
    luxurious + mysterious
    Layout
    2 col · split · balanced
    Open section →
    A bold crimson container framed by architectural cutouts pairs cinematic tasting photography with restrained editorial typography to convey rare craftsmanship.
  10. 09

    feature

    A restrained, high-contrast cultural showcase pairing quiet editorial photography with sharp geometric framing against deep black.

    Mood
    luxurious + serene
    Layout
    12 col · split · balanced
    Open section →
    A restrained, high-contrast cultural showcase pairing quiet editorial photography with sharp geometric framing against deep black.
  11. 10

    feature

    A refined editorial event feature that transitions into an impactful crimson section with massive typography and distinct visual tension.

    Mood
    luxurious + grounded
    Layout
    1 col · asymmetric · airy
    Open section →
    A refined editorial event feature that transitions into an impactful crimson section with massive typography and distinct visual tension.
  12. 11

    team

    An intense, bold crimson team spotlight combining stark black editorial typography with a geometrically cropped monochrome portrait.

    Mood
    energetic
    Layout
    1 col · stacked · balanced
    Open section →
    An intense, bold crimson team spotlight combining stark black editorial typography with a geometrically cropped monochrome portrait.
  13. 12

    team

    An aggressive, crimson-drenched member roster pairing raw brutalist typography with pixel art avatars inside shaped badge cutouts.

    Mood
    rebellious + energetic
    Layout
    1 col · grid · dense
    Open section →
    An aggressive, crimson-drenched member roster pairing raw brutalist typography with pixel art avatars inside shaped badge cutouts.
  14. 13

    other

    Strong

    Bold, pulsing crimson backdrop dominated by a rhythmic stack of heavy black typography.

    Mood
    energetic + rebellious
    Layout
    1 col · stacked · dense
    Open section →
    Bold, pulsing crimson backdrop dominated by a rhythmic stack of heavy black typography.
  15. 14

    statement

    Bold poster-like editorial blocks striking a dramatic balance between stark black and crimson with massive typographic manifestos.

    Mood
    energetic + contemplative
    Layout
    1 col · stacked · balanced
    Open section →
    Bold poster-like editorial blocks striking a dramatic balance between stark black and crimson with massive typographic manifestos.
  16. 15

    faq

    Crisp geometric crests and disciplined hairline rules create a gallery-like, highly structured editorial FAQ layout on warm stone.

    Mood
    luxurious + serene
    Layout
    2 col · split · airy
    Open section →
    Crisp geometric crests and disciplined hairline rules create a gallery-like, highly structured editorial FAQ layout on warm stone.
  17. 16

    faq

    A warm, contemplative editorial FAQ that uses generous left whitespace and crisp hairline rules to give question blocks a refined, gallery-like poise.

    Mood
    contemplative + luxurious
    Layout
    1 col · asymmetric · airy
    Open section →
    A warm, contemplative editorial FAQ that uses generous left whitespace and crisp hairline rules to give question blocks a refined, gallery-like poise.

More like this

by shared mood