큐레이션 · 오픈 · 무료

Nordebrink

순수한 콘텐츠와 우아한 계층 구조에 초점을 맞춘, 세련된 미니멀 타이포그래피 포트폴리오입니다.

01

디자인 DNA

큐레이션된 모노그래프 또는 하이엔드 디자인 포트폴리오.

02

컬러

타이포그래피와 간격에만 완전히 의존하여 계층 구조를 만드는, 강렬한 고대비 모노크롬 팔레트입니다.

03

타이포그래피

humanist-sans

• body20px · 400
• small16px · 400

세련되고 조밀한 타이포그래피 질감을 위해 좁은 음수 자간을 사용합니다. · 크기 변화 대신 이차 텍스트에 불투명도와 색상을 미묘하게 활용합니다.

04

여백

여유로운 수직 간격을 사용하며, 목록 항목에는 16px padding, 열 사이에는 30px 수평 간격을 엄격히 적용합니다.

05

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

목록 구분을 위해 미묘한 1px solid border(rgb(0,0,0))를 사용하여 무거운 시각적 블록을 피합니다.

06

레이아웃

데스크톱에서는 비대칭 레이아웃(왼쪽 좁은 열은 레이블, 오른쪽 넓은 열은 콘텐츠)을 사용하며, 모바일에서는 단일 열로 축소됩니다.

07

모션과 인터랙션

hover 상태에서 색상과 불투명도 변화를 위한 매끄러운 전환.

인터랙티브 텍스트 요소에 대한 색상 전환(채도 낮은 회색으로의 전환 가능성). · 즉각적인 내비게이션.

08

컴포넌트

• button 화살표 표시가 있는 텍스트 전용 링크이며, 인터랙션은 hover 상태에 의존합니다.
• card 없음; 콘텐츠는 평면적이고 구조화된 타이포그래피 목록으로 제시됩니다.
• chip 없음.
• input 없음.
• hero 스크롤을 위한 하향 화살표가 있는, 밀도 높은 타이포그래피 소개 블록입니다.

09

보이스와 금지 목록

• 톤 전문적이고 자신감 있으며, 매우 절제된.
• 헤드라인 시각적 장식 대신 굵은 타이포그래피 계층 구조에 의존하는 미니멀.
• CTA 미묘한 텍스트 기반 안내문 또는 간단한 화살표.

• 장식적 아이콘 사용 금지 — 스크린샷에는 최소한의 기능적 화살표가 표시됨
• 여러 글꼴 패밀리 사용 금지 — 스크린샷에는 전체적으로 단일 humanist-sans 패밀리가 표시됨
• 무거운 배경 채우기 또는 카드 사용 금지 — 스크린샷에는 순백 배경에 평면 텍스트가 표시됨
• 강조를 위해 기본 색상 사용 금지 — 스크린샷에는 엄격한 모노크롬 팔레트가 표시됨
• 넓은 자간 사용 금지 — 스크린샷에는 조밀한 텍스트를 위한 좁고 음수 자간이 표시됨
• 큰 글꼴 굵기 변화 사용 금지 — 스크린샷에는 모든 텍스트에 균일한 400 굵기가 표시됨
• 피하기: 강조를 위해 굵은 굵기나 대문자를 과도하게 사용.
• 피하기: 장식적 요소, 아이콘 또는 일러스트.
• 피하기: 복잡한 다색 팔레트 또는 그라데이션.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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