큐레이션 · 오픈 · 무료

Emil Kowalski

깔끔하고 타이포그래피를 우선시하는 접근 방식을 가진, 차분하고 개발자 중심의 포트폴리오입니다.

01

디자인 DNA

잘 정돈된 노트

02

컬러

따뜻한 오프화이트 베이스와 고대비 타이포그래피를 가진 모노크롬 팔레트입니다.

03

타이포그래피

humanist-sans

• h216px · 500

본문 텍스트는 부드러운 가독성을 위해 밝은 그레이 (#63635e)를 사용합니다. · 섹션 제목은 검정색 (#21201c)을 사용하고 약간 더 굵게 설정합니다. · 본문 텍스트는 일관된 24px 줄 높이를 유지합니다.

04

여백

수직 리듬은 일관된 24px 줄 높이와 주요 섹션 간의 넉넉한 96px 수직 간격으로 확립됩니다.

05

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

1px solid border color (rgb(233,233,231))

0 0 0 1px rgba(0,0,0,0.08) · 0 2px 2px 0 rgba(0,0,0,0.04)

06

레이아웃

좁고 중앙에 배치된 컨테이너를 가진 단일 열 레이아웃입니다.

07

모션과 인터랙션

인터랙티브 요소에 대한 미묘한 색상 전환입니다.

호버 시 미묘한 색상 변화 (transition: 0.15s). · 기본 클릭 동작입니다.

08

컴포넌트

• button 흰색 텍스트를 가진 다크색 타원형 기본 액션 버튼입니다.
• card 해당 없음 - 카드 없는 미니멀한 목록 기반 구조입니다.
• chip 해당 없음
• input 미묘한 테두리를 가진 둥근 입력 필드입니다.
• hero 이름, 직함, 소개를 포함한 미니멀한 텍스트 기반 히어로 섹션입니다.

09

보이스와 금지 목록

• 톤 자신감 있고 전문적이며 직설적입니다.
• 헤드라인 간결하고 직접적이며, 종종 단일 단어 또는 짧은 구문으로 구성됩니다.
• CTA 고대비 버튼 위의 단순하고 행동 지향적인 텍스트입니다.

• 밝고 채도 높은 강조 색상을 사용하지 마세요 - 스크린샷은 모노크롬 팔레트를 보여줍니다.
• 복잡한 다중 열 레이아웃을 사용하지 마세요 - 스크린샷은 단일 좁은 열을 보여줍니다.
• 무거운 그림자를 사용하지 마세요 - 스크린샷은 최소한의 미묘한 테두리를 보여줍니다.
• 크고 드라마틱한 타이포그래피를 사용하지 마세요 - 스크린샷은 절제된 읽기 쉬운 스케일을 보여줍니다.
• 순수 기하학적 또는 휴머니스트 특성을 가진 산세리프 폰트를 사용하지 마세요 - 스크린샷은 깔끔하고 중립적인 산세리프를 보여줍니다.
• 과도한 패딩이나 마진을 사용하지 마세요 - 스크린샷은 타이트하고 일관된 간격을 보여줍니다.
• 피하기: 마케팅성 과장 표현
• 피하기: 복잡한 전문 용어
• 피하기: 과도한 느낌표 사용

10

팩 안의 실제 스크린샷

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

11

System Prompt

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