큐레이션 · 오픈 · 무료

Bpowell

강렬한 타이포그래피와 극단적 여백으로 구동되는 미니멀리스트 포트폴리오입니다.

01

디자인 DNA

하이엔드 디자인 모노그래프

02

컬러

깊은 검정 텍스트와 순백 여백 사이의 대비에 의존하는 엄격한 모노크롬 팔레트입니다.

03

타이포그래피

grotesque-sans

• display86px · 500
• body26px · 500

디스플레이 크기에서 좌측으로 밀착된 자간 · 기본 강조를 위해 미디엄 웨이트 사용 · 헤더와 본문 간의 고대비 크기 차이

04

여백

비대칭적, 컨텐츠 섹션을 분리하기 위해 거대한 네거티브 공간 블록 사용

05

표면 (라운드 / 그림자 / 경계선)

기본 서피스에는 보더 없음; 인터랙티브 링크에 2px solid 보더 적용

06

레이아웃

멀티컬럼 헤더와 거대한 싱글컬럼 컨텐츠 블록을 포함하는 비대칭 격자

07

모션과 인터랙션

모든 요소에 부드러운 상태 변화를 위한 CSS 트랜지션 적용

텍스트 링크의 미세한 투명도 또는 색상 변화 · 즉각적인 네비게이션 트랜지션

08

컴포넌트

• button 하단 보더 2px와 포인터 커서를 가진 텍스트 전용 링크
• card 없음
• chip 없음
• input 없음
• hero 좁은 행간과 네거티브 자간을 가진 과대 크기의 타이포그래피 프로젝트 목록

09

보이스와 금지 목록

• 톤 조용히 자신감 있고, 전문적이며, 세련된
• 헤드라인 장식 요소 없이 규모와 타이포그래피에만 전적으로 의존하는 미니멀리스트
• CTA 미세한 밑줄을 사용하는 절제된 간단한 텍스트 링크

• 드롭 섀도우 사용 금지 — 스크린샷은 평면적이고 그림자 없는 서피스를 보여줍니다
• 멀티컬러 팔레트 사용 금지 — 스크린샷은 엄격히 모노크롬 블랙 앤 화이트를 보여줍니다
• 컨테이너에 둥근 모서리 사용 금지 — 스크린샷은 날카롭고 사각형 모서리를 보여줍니다
• 메인 컨텐츠에 중앙 정렬 텍스트 사용 금지 — 스크린샷은 좌측 정렬된 타이포그래피를 보여줍니다
• 장식적인 세리프 폰트 사용 금지 — 스크린샷은 엄격히 세리프 없는 타이포그래피를 보여줍니다
• 작고 소심한 디스플레이 텍스트 사용 금지 — 스크린샷은 거대하고 지배적인 헤딩을 보여줍니다
• 피하기: 컬러풀한 액센트
• 피하기: 드롭 섀도우
• 피하기: 복잡한 그라디언트
• 피하기: 둥근 컨테이너
• 피하기: 일러스트레이션
• 피하기: 복잡한 레이아웃

10

팩 안의 실제 스크린샷

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko