큐레이션 · 오픈 · 무료

Consumedinkey

날카로운 대비와 사진적 요소를 사용하는 미니멀하고 분위기 있는 음악 협업 웹사이트.

01

디자인 DNA

음악 프로젝트를 위한 분위기 있는 냉소적 갤러리 전시회.

02

컬러

순수한 흑백을 사용하여 냉소적이고 집중된 분위기를 만드는 고대비 단색 팔레트.

03

타이포그래피

humanist-sans

• display64px · 400
• body16px · 400

HelveticaLT 또는 유사한 휴머니스트-산스 사용. · 글꼴 굵기를 400으로 일관되게 유지. · 모든 텍스트에 미세하고 양의 자간 적용.

04

여백

넉넉한 패딩과 일관된 간격이 개방적이고 숨 쉬는 레이아웃을 만듭니다.

05

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

날카롭고 단단한 모서리. border-radius 없음. 콘텐츠는 공간에 떠 있습니다.

06

레이아웃

풀블리드 영웅 섹션, 그 다음 중앙 비주얼과 양쪽 텍스트 칼럼을 둔 어두운 콘텐츠 섹션.

07

모션과 인터랙션

모든 요소에 전역 트랜지션 속성이 있어 상호작용 시 원활한 상태 변화를 암시합니다.

포인터 커서가 있는 요소는 색상 또는 불투명도 변화를 통해 상태가 변경될 가능성이 높습니다. · 표준 포인터 클릭 동작.

08

컴포넌트

• button 간단한 구분선이 있는 텍스트 기반 동작 (예: '들어보기 | 구매').
• card 사용되지 않음. 비주얼은 몰입형 에지투에지 이미지로 제시.
• chip 없음.
• input 없음.
• hero 전체 화면, 분위기 있는 흑백 사진 영웅에 오버레이된 텍스트.

09

보이스와 금지 목록

• 톤 차분하고 절제된, 그리고 신비로운.
• 헤드라인 앨범 제목과 아티스트 이름을 사용하는 단순하고 선언적인 스타일.
• CTA 파이프 구분자를 사용하는 미니멀하고 직접적인 스타일.

• 어떤 요소에도 border-radius를 사용하지 마세요 — 스크린샷은 모든 곳에서 완벽하게 날카로운 모서리를 보여줍니다.
• 밝은 강조색을 도입하지 마세요 — 스크린샷은 엄격히 단색 흑백입니다.
• 장식용 또는 세리프 글꼴을 사용하지 마세요 — 스크린샷은 깔끔하고 기하학적인 산스세리프(HelveticaLT)를 사용합니다.
• 드롭 섀도우 또는 박스 섀도우를 추가하지 마세요 — 요소는 배경에 평면적으로 보입니다.
• 복잡한 배경 패턴 또는 그라데이션을 사용하지 마세요 — 배경은 단색 또는 풀블리드 이미지입니다.
• 여러 글꼴 굵기를 사용하지 마세요 — 스크린샷은 전체적으로 일관된 단일 굵기(400)를 보여줍니다.
• 피하기: 감탄사 또는 지나치게 열정적인 언어를 피합니다.
• 피하기: 복잡한 문장이나 단락을 피합니다.
• 피하기: 밝고 채도 높은 색상을 피합니다.
• 피하기: 장식용 글꼴 또는 과도한 글꼴 굵기를 피합니다.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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