디자인 스타일
네오 브루탈리즘(Neo-Brutalism)
네오 브루탈리즘(Neo-Brutalism)은 웹 브루탈리즘의 직설적인 표현을 밝은 색과 장난스러운 UI 요소로 재해석한 스타일입니다.
쉬운 설명
굵은 테두리, 선명한 색상과 딱딱한 그림자로 의도적인 거칠기를 드러내는 스타일.
Visual sample
눈으로 보면 이렇습니다
굵은 검은색 테두리, 원색과 옵셋 그림자로 만든 네오 브루탈리즘 샘플
- 굵은 테두리
- 고대비 색상
- 딱딱한 옵셋 그림자
Soft neo-brutalism, bold black borders, vivid primary colors, hard offset shadows, playful but readable Style variations
같은 스타일도 이렇게 달라집니다
콘텐츠 구조는 같게 두고 색, 선, 모서리와 타이포그래피의 강도를 달리한 세 가지 표현입니다.클래식 네오 브루탈리즘
원색과 4px 검은 테두리, 단단한 옵셋 그림자로 가장 전형적인 인상을 만듭니다.
Classic neo-brutalism, primary colors, 4px black borders, square corners, 8px hard offset shadows 소프트 네오 브루탈리즘
파스텔 색, 2px 테두리와 작은 둥근 모서리로 친근하고 가벼운 인상을 냅니다.
Soft neo-brutalism, pastel blocks, 2px black borders, 10px radius, short hard shadows, friendly tone 에디토리얼 네오 브루탈리즘
흑백 면과 큰 제목, 비대칭 구성을 중심으로 포스터와 독립 잡지 같은 분위기를 만듭니다.
Editorial neo-brutalism, monochrome grid, oversized grotesk type, asymmetric layout, one orange accent Visual DNA
스타일을 만드는 구체적인 요소
단어 하나보다 아래 요소를 함께 지정해야 AI가 더 일관된 결과를 만듭니다.선과 테두리
2–4px · Solid주요 카드와 버튼에 번짐 없는 검은 실선을 사용합니다. 작은 라벨까지 모두 감싸지 않는 것이 좋습니다.
모서리
0–12px클래식은 거의 각지고, 소프트 변형은 8–12px를 사용합니다. 알약형은 배지에만 제한합니다.
컬러 톤
고채도 · 고대비크림색 바탕에 노랑, 빨강, 민트 같은 선명한 색을 2–3개 조합합니다.
타이포그래피
Grotesk · 700–900제목은 굵고 촘촘하게, 본문은 단순한 산세리프로 유지합니다. 한글은 구조가 단단한 고딕 계열이 잘 맞습니다.
아이콘
굵은 Outline2–3px의 기하학적인 선 아이콘이나 단순한 filled icon을 한 계열로 통일합니다.
그림자
4–8px · No blur한 방향으로 밀린 검은 면을 사용합니다. 번지는 소프트 섀도는 스타일의 힘을 약하게 만듭니다.
간격과 밀도
16–32px · Compact블록 내부는 촘촘하게, 섹션 사이는 분명하게 벌려 포스터처럼 강한 리듬을 만듭니다.
모션
100–200ms · Directhover에서는 색을 반전하고 press에서는 그림자만큼 눌리는 짧고 직접적인 피드백이 잘 어울립니다.
Where it works
어떤 프로젝트에 잘 어울리나요?
스타일의 강도는 제품의 목적과 사용자가 읽어야 하는 정보량에 맞춰 조절해야 합니다.적극적으로 추천
작업자의 개성과 실험적인 태도를 첫 화면부터 강하게 전달할 수 있습니다.
포스터 같은 색과 타이포그래피가 행사와 콘텐츠의 에너지를 살려줍니다.
친근한 색과 직접적인 상태 표현이 참여 중심 서비스에 잘 맞습니다.
강도를 조절해서 적용
전체 화면보다 CTA, 상태 배지와 핵심 요약 카드에 제한적으로 적용하는 편이 좋습니다.
시각적 소음이 신뢰와 빠른 정보 판독을 방해하지 않도록 강도를 크게 낮춰야 합니다.
굵은 선과 원색이 반복되면 읽기 피로가 커지므로 본문 영역에는 중립적인 표현이 필요합니다.
Compare
비슷한 스타일과 무엇이 다른가요?
둘 다 거칠고 직접적이지만, 네오 브루탈리즘은 정돈된 사용성과 친근한 상업적 표현을 더 많이 유지합니다.네오 브루탈리즘(Neo-Brutalism)
- 원색과 장난스러운 색면
- 정돈된 카드와 그리드
- 사용성과 가독성을 대체로 유지
Brutalism
- 날것의 브라우저·문서 감성
- 비정형·의도적으로 불편한 배치
- 가독성 파괴도 표현 수단으로 사용
Prompt recipe
AI에게 요청할 때는 이렇게 조합하세요
Soft neo-brutalism, bold black borders, vivid primary colors, hard offset shadows, playful but readable. Keep body content readable, preserve clear hierarchy, and avoid decorative effects that do not support the chosen style. Final check
완성 전에 확인하세요
- 01
주요 컴포넌트의 테두리 굵기가 일관적인가?
- 02
포인트 색상을 2–3개 안에서 절제해 사용했는가?
- 03
그림자의 방향과 강도가 화면 전체에서 일관적인가?
- 04
제목과 본문의 역할 및 읽기 순서가 분명한가?
- 05
모바일에서도 장식이 콘텐츠를 압도하지 않는가?
- 06
hover와 press가 주변 레이아웃을 움직이지 않는가?
Explore more