SearchSubmit
MUUDS

Curated catalog of analyzed web design.

Superset

Engineered, clinical, and unapologetically developer-native. Deep obsidian backgrounds are punctuated by high-fidelity terminal mockups, code diffs, and precise copper target framing. The aesthetic reflects a calm, mission-critical workspace for high-velocity software engineering.

clinical
Visit site

Colour

Background#111111
Text#fafafa
Accent#ce5814
Surface#171717
Muted#a1a1a1

Typefaces

Display
ui-sans-serif
Body
ui-sans-serif
Mono
ui-monospace
Source
system
Scale
11 · 12 · 13 · 14 · 15 · 17

Layout

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

Capture

Category
tools
Sections
17
Captured
2026-08-29
Rhythm
dark x17

Type rules

  • display headlines use sentence case with tight tracking (-0.025em)
  • monospace type for all system outputs, branch names, and command lines
  • section eyebrows set in uppercase mono with subtle warm copper tint

Colour rules

  • dominant deep black background (#111111) across every section with dark charcoal surface panels (#171717)
  • burnt copper/orange (#ce5814) reserved strictly for subtle focal targeting brackets and eyebrow tags
  • mint green (#00bf80) used only for success states, diff additions, and status indicators

Voice rules

  • lead with developer actions, never generic productivity claims
  • reference authentic tooling primitives like worktrees, branches, and CLI

Holds it together

  • feature sections must pair concise copy with an authentic CLI or IDE screenshot mockup
  • use subtle burnt-orange corner reticles to frame central hero focal points
  • keep all interactive controls in dark, bordered pills or subtle monochrome buttons

Contrast

text on background18.1:1 AAA
muted text on background7.3:1 AAA
text on surface17.2:1 AAA
accent on background4.5:1 AA
background on accent4.5:1 AA

Type, measured

Body
15px / 1.63
Measure
53 characters
Display
72px / 1.1
Tracking
-0.025em display
Scale ratio
1.48

Voice

Tone
declarative, precise, engineered
Sentences
short
Person
second
Vocabulary
technical
Calls to action
download, view, star, install

Built with

Builder
—
Framework
next
Motion
—
WebGL
—
Nav
top_bar, 3 items
Length
11.7 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

    nav

    Sparse and dark developer navigation bar with a blocky geometric logo and understated utility links.

    Mood
    clinical + raw
    Layout
    12 col · split · airy
    Open section →
    Sparse and dark developer navigation bar with a blocky geometric logo and understated utility links.
  2. 01

    hero

    Minimal dark developer hero centered on high-contrast typography framed by precise orange target brackets.

    Mood
    clinical + bold
    Layout
    14 col · centered · airy
    Open section →
    Minimal dark developer hero centered on high-contrast typography framed by precise orange target brackets.
  3. 02

    showcase

    Strong

    High-density dark IDE interface showcasing an AI coding assistant running tasks inside an integrated workspace terminal.

    Mood
    clinical + raw
    Layout
    11 col · split · dense
    Open section →
    High-density dark IDE interface showcasing an AI coding assistant running tasks inside an integrated workspace terminal.
  4. 03

    logo bar

    A dark, disciplined grid of monochrome tech logos framed in subtle outlined tiles beneath a restrained header.

    Mood
    clinical + quiet
    Layout
    7 col · grid · balanced
    Open section →
    A dark, disciplined grid of monochrome tech logos framed in subtle outlined tiles beneath a restrained header.
  5. 04

    feature

    Strong

    Precise, dark developer tooling layout presenting a three-step process with disciplined typography and subtle copper accents.

    Mood
    clinical + quiet
    Layout
    3 col · grid · airy
    Open section →
    Precise, dark developer tooling layout presenting a three-step process with disciplined typography and subtle copper accents.
  6. 05

    feature

    Crisp dark-mode developer feature split between concise left-aligned copy and a sharp terminal UI dropdown.

    Mood
    clinical + quiet
    Layout
    12 col · split · airy
    Open section →
    Crisp dark-mode developer feature split between concise left-aligned copy and a sharp terminal UI dropdown.
  7. 06

    feature

    Clean, engineered dark-mode feature section pairing an authentic CLI agent interface with crisp, focused copy.

    Mood
    clinical + raw
    Layout
    2 col · split · balanced
    Open section →
    Clean, engineered dark-mode feature section pairing an authentic CLI agent interface with crisp, focused copy.
  8. 07

    feature

    Minimal, developer-centric feature split pairing concise copy with a dark monospace terminal automation window.

    Mood
    clinical + raw
    Layout
    14 col · split · airy
    Open section →
    Minimal, developer-centric feature split pairing concise copy with a dark monospace terminal automation window.
  9. 08

    feature

    Dark, clinical developer-tool feature section pairing a realistic code diff mockup with concise technical explanation.

    Mood
    clinical + raw
    Layout
    11 col · split · balanced
    Open section →
    Dark, clinical developer-tool feature section pairing a realistic code diff mockup with concise technical explanation.
  10. 09

    feature

    Sparse dark-mode developer feature split with crisp typography beside a minimalist terminal emulator mockup.

    Mood
    clinical + quiet
    Layout
    2 col · split · airy
    Open section →
    Sparse dark-mode developer feature split with crisp typography beside a minimalist terminal emulator mockup.
  11. 10

    feature

    Dark, precise developer feature section pairing an authentic terminal CLI mockup with crisp technical copy.

    Mood
    clinical + quiet
    Layout
    14 col · split · airy
    Open section →
    Dark, precise developer feature section pairing an authentic terminal CLI mockup with crisp technical copy.
  12. 11

    feature

    Crisp and clinical dark-mode product feature pairing concise copy with a floating macOS IDE selector interface.

    Mood
    clinical + quiet
    Layout
    1 col · split · airy
    Open section →
    Crisp and clinical dark-mode product feature pairing concise copy with a floating macOS IDE selector interface.
  13. 12

    testimonial

    A dense, dark grid of developer testimonials styled like subtle social cards, projecting technical credibility and peer consensus.

    Mood
    clinical + raw
    Layout
    3 col · grid · dense
    Open section →
    A dense, dark grid of developer testimonials styled like subtle social cards, projecting technical credibility and peer consensus.
  14. 13

    feature grid

    Austere dark security section pairing crisp typographic hierarchy with a three-card feature grid and SOC 2 certification seal.

    Mood
    clinical + quiet
    Layout
    3 col · stacked · balanced
    Open section →
    Austere dark security section pairing crisp typographic hierarchy with a three-card feature grid and SOC 2 certification seal.
  15. 14

    faq

    A crisp, dark-mode FAQ section structured cleanly with an asymmetric split layout and minimalist accordion rows.

    Mood
    clinical + quiet
    Layout
    2 col · split · balanced
    Open section →
    A crisp, dark-mode FAQ section structured cleanly with an asymmetric split layout and minimalist accordion rows.
  16. 15

    cta

    Strong

    A dark, highly restrained developer call-to-action centered around a tabbed CLI installation widget.

    Mood
    clinical + quiet
    Layout
    11 col · stacked · airy
    Open section →
    A dark, highly restrained developer call-to-action centered around a tabbed CLI installation widget.
  17. 16

    footer

    Minimalist dark multi-column footer with precise typographic hierarchy and subdued navigation links.

    Mood
    clinical + quiet
    Layout
    5 col · split · balanced
    Open section →
    Minimalist dark multi-column footer with precise typographic hierarchy and subdued navigation links.