Design Atlas
한국어
❖ Design styles

Maximalism

맥시멀리즘

Layer color, pattern and typography until nothing is left empty — a dense, "more is more" reaction against minimalism.

Also known as: More-is-more design
···
html
<div class="stack">
  <div class="layer l1"></div>
  <div class="layer l2"></div>
  <span class="type t1">BOLD</span>
  <span class="type t2">and loud</span>
  <div class="sticker"></div>
</div>
css
body{background:#171018}
.stack{position:relative;width:min(88%,300px);aspect-ratio:1.2;overflow:hidden;border-radius:8px}
.layer{position:absolute;inset:0}
.l1{background:
    repeating-linear-gradient(45deg,#ff5c8a 0 10px,transparent 10px 20px),
    linear-gradient(160deg,#5b5bf7,#18c29c);
  mix-blend-mode:screen;opacity:.7}
.l2{background:radial-gradient(circle at 70% 30%,#f4c515 0%,transparent 55%),
    radial-gradient(circle at 20% 80%,#ff5c8a 0%,transparent 50%);
  animation:drift 6s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(4%,-3%) scale(1.06)}}
.type{position:absolute;font-family:"Arial Black",sans-serif;font-weight:900;color:#fff;
  text-shadow:2px 2px 0 #111}
.t1{left:8%;top:18%;font-size:clamp(24px,6vmin,34px);transform:rotate(-4deg)}
.t2{left:14%;bottom:14%;font-size:clamp(13px,3vmin,17px);font-style:italic;color:#f4c515;transform:rotate(2deg)}
.sticker{position:absolute;right:8%;top:10%;width:22%;aspect-ratio:1;border-radius:50%;
  background:#fff;box-shadow:0 4px 10px rgba(0,0,0,.4);animation:spin 5s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

It rose in the late 2010s as a reaction to fatigue with minimal SaaS landing pages that all started looking the same (the "Corporate Memphis" complaint) — layering different textures, colors and typefaces collage-style until the screen approaches "horror vacui," a fear of empty space.

Its markers are stacked background patterns, mixing two or three large, high-contrast headline typefaces on one screen, and color combinations that deliberately clash at high saturation. It can look ruleless, but there's usually a hidden order — clear z-index layering, plus one repeated element (often a specific color) tying it together.

It suits fashion, music and culture brands where "energy" and personality are the point. On screens where users need to find the next action fast — buy, sign up — the visual noise can hurt conversion, so it needs care.