SearchSubmit
MUUDS

Curated catalog of analyzed web design.

Kikxle

Quiet and focused dark portfolio aesthetic. Deep charcoal canvases host clean UI mockups, accented with precise touches of warm amber.

quiet
Visit site

Colour

Background#0b0d12
Text#ffffff
Accent#ffa621
Surface#12141c
Muted#abb0b5

Typefaces

Display
Open Sans
Body
Open Sans
Mono
—
Source
self_hosted
Scale
14 · 16 · 18 · 20 · 21 · 24

Layout

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

Capture

Category
portfolio
Sections
4
Captured
2026-08-30
Rhythm
dark x4

Type rules

  • display type set in sentence case with warm amber highlights
  • body text set at 21px with generous 77 character measure

Colour rules

  • deep dark background across all sections with subtle surface card elevation
  • warm amber #ffa621 reserved for primary headline focus and active UI states

Voice rules

  • conversational first-person intro
  • direct project descriptions

Holds it together

  • apply amber accent strictly to headline key phrases and selected interactive states
  • contain case studies and skills within elevated dark cards or high-contrast white tiles

Contrast

text on background19.4:1 AAA
muted text on background8.9:1 AAA
text on surface18.4:1 AAA
accent on background9.9:1 AAA
background on accent9.9:1 AAA

Type, measured

Body
21px / 1.5
Measure
77 characters
Display
36px / 0.89
Tracking
0em display
Scale ratio
1.14

Voice

Tone
approachable, professional
Sentences
medium
Person
first
Vocabulary
plain
Calls to action
chat, make enquiry

Built with

Builder
—
Framework
gatsby
Motion
—
WebGL
—
Nav
top_bar, 8 items
Length
3.7 screens

Sections in page order

3 marked strong · 4

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

  1. 00

    hero

    Dark and restrained portfolio hero featuring a centered introduction in warm amber above a detailed fintech dashboard mockup.

    Mood
    quiet + clinical
    Layout
    1 col · stacked · balanced
    Open section →
    Dark and restrained portfolio hero featuring a centered introduction in warm amber above a detailed fintech dashboard mockup.
  2. 01

    feature

    Strong

    Subtle dark portfolio cards floating over a faint wireframe backdrop showcase design skills and tools with warm amber typography.

    Mood
    quiet + clinical
    Layout
    1 col · grid · airy
    Open section →
    Subtle dark portfolio cards floating over a faint wireframe backdrop showcase design skills and tools with warm amber typography.
  3. 02

    showcase

    Strong

    Clean, high-contrast portfolio cards showcase digital product case studies against a solid dark canvas.

    Mood
    quiet + clinical
    Layout
    3 col · grid · balanced
    Open section →
    Clean, high-contrast portfolio cards showcase digital product case studies against a solid dark canvas.
  4. 03

    testimonial

    Strong

    A focused dark testimonial card floating against a subtle starry space background with warm amber active accents.

    Mood
    quiet
    Layout
    1 col · centered · balanced
    Open section →
    A focused dark testimonial card floating against a subtle starry space background with warm amber active accents.

More like this

by shared mood