큐레이션 · 오픈 · 무료

Diogoakio Com Br

대담한 타이포그래피와 다크 몰입형 갤러리 경험에 초점을 맞춘 독립 디자이너 & 아트 디렉터를 위한 정제된 포트폴리오 사이트.

01

디자인 DNA

큐레이션된 고대비 전시가 있는 디지털 갤러리.

02

컬러

고대비와 절제를 사용하여, 다크 배경을 통해 사진과 타이포그래피가 돋보이게 합니다.

03

타이포그래피

humanist-sans

• display34px · 400
• body16px · 400

모든 텍스트는 400 웨이트를 사용합니다. · 디스플레이는 마이너스 자간을, 본문은 플러스 자간을 사용합니다. · 타이포그래피가 주요 구조적 요소입니다.

04

여백

일관된 30px 간격이 주요 섹션 구분을 정의합니다.

05

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

최소화하거나 존재하지 않습니다. 간격과 배경 대비를 통해 구분을 Achieve합니다.

06

레이아웃

상단 정렬된 두드러진 히어로 문구와 그리드 기반 포트폴리오 갤러리를 담은 풀블리드 다크 캔버스.

07

모션과 인터랙션

모든 요소에 부드러운 상태 변화를 위해 표준 'all' 트랜지션이 적용됩니다.

시각적 피드백은 상호작용 요소에 미묘한 색상 변화 또는 드러남을 포함할 가능성이 높습니다. · 프로젝트 오버레이와 같은 더 많은 콘텐츠를 드러내기 위한 전환.

08

컴포넌트

• button 다크 배경에서 높은 대비를 가진 미니멀리스트 텍스트 링크 또는 버튼.
• card 그리드 내에서 대형 사진 카드 또는 깔끔한 텍스트 블록으로 표시되는 콘텐츠.
• chip 단순하고 꾸밈없는 텍스트 요소.
• input 제공된 스크린샷에 표시되지 않음.
• hero 전체 페이지를 기반으로 하는 거대한 풀와이드 타이포그래피 문구.

09

보이스와 금지 목록

• 톤 자신감 있고 직접적이며 전문적입니다.
• 헤드라인 선언적이고 간결하며, 디자이너의 이름을 주요 훅으로 사용합니다.
• CTA 'Ver materia'와 같이 절제되고 기능적입니다.

• 흰색 배경을 사용하지 마세요 — 스크린샷은 지배적인 다크 테마를 보여줍니다.
• 굵은 폰트 웨이트를 사용하지 마세요 — 스크린샷은 일관된 400 웨이트를 보여줍니다.
• 드롭 섀도우를 추가하지 마세요 — 스크린샷은 플랫하고 표면 수준의 깊이를 보여줍니다.
• 다양한 색상을 사용하지 마세요 — 스크린샷은 엄격한 단색 팔레트를 보여줍니다.
• 요소에 둥근 모서리를 사용하지 마세요 — 스크린샷은 날카롭고 사각적인 모서리를 보여줍니다.
• 복잡한 장식 테두리를 사용하지 마세요 — 스크린샷은 구분을 위해 간격에 의존합니다.
• 피하기: 과도한 장식
• 피하기: 화려한 색상
• 피하기: 복잡한 전문 용어

10

팩 안의 실제 스크린샷

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

11

System Prompt

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