SearchSubmit
MUUDS

Curated catalog of analyzed web design.

Podspace

Deep-space utilitarian precision paired with playful tactile 3D elements. Rich obsidian backgrounds frame detailed dark-mode software interfaces, punctuated by centered inline platform badges inside large display typography.

playfulclinicalquiet
Visit site

Colour

Background#050505
Text#fcfdff
Accent#efedfd
Surface#0e0e10
Muted#9194a1

Typefaces

Display
Inter
Body
Inter
Mono
—
Source
google
Scale
10 · 12 · 14 · 16 · 20 · 22

Layout

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

Capture

Category
saas
Sections
11
Captured
2026-08-30
Rhythm
dark x11

Type rules

  • display headlines set in sentence case with tight line height
  • body text constrained to approximately 68 characters per measure
  • metadata and secondary UI labels set at 10px to 12px sizes

Colour rules

  • background remains in pitch black (#050505) across all body sections
  • subtle elevated surfaces use dark charcoal (#0e0e10) for UI containers
  • muted grey (#9194a1) reserved exclusively for body descriptions and sublabels

Voice rules

  • keep hero and feature statements broken into short, rhythmic fragments
  • label feature categories with small subdued subheadings

Holds it together

  • integrate brand and UI icons directly into headline text flows
  • frame product capabilities inside dark modular bento cards with micro-typography
  • keep navigation and sub-controls in compact floating rounded pills

Contrast

text on background20.0:1 AAA
muted text on background6.8:1 AA
text on surface18.9:1 AAA
accent on background17.7:1 AAA
background on accent17.7:1 AAA

Type, measured

Body
22px / 1.3
Measure
68 characters
Display
56px / 1
Tracking
0em display
Scale ratio
1.26

Voice

Tone
technical, authoritative, concise
Sentences
short
Person
second
Vocabulary
technical
Calls to action
book, try, get, explore

Built with

Builder
framer
Framework
—
Motion
—
WebGL
—
Nav
top_bar, 5 items
Length
7 screens

Sections in page order

3 marked strong · 11

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

  1. 00

    hero

    Dark cosmic hero floating playful 3D audio assets above an oversized centered headline with embedded platform icons.

    Mood
    playful + dreamy
    Layout
    1 col · stacked · airy
    Open section →
    Dark cosmic hero floating playful 3D audio assets above an oversized centered headline with embedded platform icons.
  2. 01

    showcase

    A precision-crafted dark desktop software interface showcasing an episode management dashboard and contextual account switcher.

    Mood
    clinical + quiet
    Layout
    2 col · centered · dense
    Open section →
    A precision-crafted dark desktop software interface showcasing an episode management dashboard and contextual account switcher.
  3. 02

    logo bar

    Understated dark logo grid presenting client media partners with clean monochrome balance.

    Mood
    quiet + clinical
    Layout
    12 col · grid · balanced
    Open section →
    Understated dark logo grid presenting client media partners with clean monochrome balance.
  4. 03

    feature grid

    Strong

    Dark, precision-engineered bento feature grid highlighting creator dashboard tools with granular UI controls and crisp typography.

    Mood
    clinical + quiet
    Layout
    3 col · grid · balanced
    Open section →
    Dark, precision-engineered bento feature grid highlighting creator dashboard tools with granular UI controls and crisp typography.
  5. 04

    testimonial

    Deep black, centered executive pull quote presented with crisp typography and understated attribution.

    Mood
    quiet + clinical
    Layout
    4 col · centered · airy
    Open section →
    Deep black, centered executive pull quote presented with crisp typography and understated attribution.
  6. 05

    feature

    Strong

    Crisp dark platform showcase centered on a 3D packaging asset with inline icons embedded inside bold typography.

    Mood
    playful + bold
    Layout
    1 col · centered · airy
    Open section →
    Crisp dark platform showcase centered on a 3D packaging asset with inline icons embedded inside bold typography.
  7. 06

    feature grid

    Clean, utilitarian dark feature grid with precise iconography, muted pill tags, and structured typographic hierarchy.

    Mood
    clinical + quiet
    Layout
    3 col · grid · balanced
    Open section →
    Clean, utilitarian dark feature grid with precise iconography, muted pill tags, and structured typographic hierarchy.
  8. 07

    feature

    Strong

    Minimalist dark node graph simulating a technical distribution pipeline with fine wireframes and subtle interface controls.

    Mood
    clinical + quiet
    Layout
    1 col · centered · airy
    Open section →
    Minimalist dark node graph simulating a technical distribution pipeline with fine wireframes and subtle interface controls.
  9. 08

    testimonial

    A minimal, restrained dark testimonial presenting a centered quote with disciplined typography on pure black.

    Mood
    quiet
    Layout
    8 col · centered · airy
    Open section →
    A minimal, restrained dark testimonial presenting a centered quote with disciplined typography on pure black.
  10. 09

    faq

    A dark, disciplined FAQ accordion stack styled with subtle rounded pill containers and code-inspired syntax.

    Mood
    clinical + quiet
    Layout
    1 col · stacked · dense
    Open section →
    A dark, disciplined FAQ accordion stack styled with subtle rounded pill containers and code-inspired syntax.
  11. 10

    footer

    A restrained, functional dark-mode footer with precise compliance badges and clean column navigation.

    Mood
    clinical + quiet
    Layout
    1 col · split · airy
    Open section →
    A restrained, functional dark-mode footer with precise compliance badges and clean column navigation.

More like this

by shared mood