큐레이션 · 오픈 · 무료

Films53 12

블랙 캔버스 위에 대담한 타이포그래피를 사용하는 미니멀리스트 필름그래피 사이트.

01

디자인 DNA

날카로운 모던 타이포그래피로 프레젠테이션되는 시네마틱 필름그래피.

02

컬러

극대화된 시네마틱 임팩트를 위한 날카롭고 고대비의 단색.

03

타이포그래피

grotesque-sans

• display200px · 300
• headline68px · 300
• body14px · 300

모든 텍스트는 대문자 · 주요 폰트 웨이트는 가벼움 (300) · 필름 타이틀은 크고 시각적으로 지배적

04

여백

비대칭적이고 여유로운, 타이포그래피 요소를 분리하기 위해 넉넉한 여백을 사용.

05

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

보이는 테두리 없음; 순수한 공간 대비에 의존.

06

레이아웃

흩어진 타이틀을 가진 자유로운 타이포그래피 그리드.

07

모션과 인터랙션

hover 시 미세한 불투명도 또는 transform 전환.

커서가 포인터로 변경; 미세한 색상 또는 불투명도 변화 가능성. · 필름 상세 페이지로의 즉각적인 내비게이션.

08

컴포넌트

• button 보이는 테두리나 배경 없는 간단한 텍스트 링크.
• card 없음; 레이아웃은 순전히 타이포그래피.
• chip 없음.
• input 없음.
• hero 뷰포트 상단에 위치한 거대하고 화면 전체를 가로지르는 로고타입.

09

보이스와 금지 목록

• 톤 격식 있고, 기록적이며, 시네마틱.
• 헤드라인 대문자, 가벼운 웨이트, 넓은 자간.
• CTA 전통적인 버튼 스타일링 없는 미니멀리스트 텍스트 링크.

• 볼드 폰트 웨이트를 사용하지 마세요 — 스크린샷은 오직 가벼운(300) 타이포그래피만 보여줍니다.
• 드롭 섀도우나 3D 효과를 추가하지 마세요 — 스크린샷은 플랫하고 고대비의 디자인을 보여줍니다.
• 밝은 강조 색상을 사용하지 마세요 — 스크린샷은 블랙과 밝은 핑크빛 화이트의 엄격한 단색 팔레트를 보여줍니다.
• 둥근 모서리나 카드 기반 레이아웃을 사용하지 마세요 — 스크린샷은 날카롭고 여백 없는 텍스트 요소를 보여줍니다.
• 텍스트를 양쪽 정렬하지 마세요 — 스크린샷은 역동적인 느낌을 위해 좌우 정렬을 혼합하여 보여줍니다.
• 아이콘으로 인터페이스를 복잡하게 만들지 마세요 — 스크린샷은 거의 순수하게 타이포그래피인 내비게이션을 보여줍니다.
• 피하기: 볼드 웨이트 사용 금지
• 피하기: 장식적인 테두리 또는 그림자 추가 금지
• 피하기: 여러 색상 또는 그라데이션 사용 금지

10

팩 안의 실제 스크린샷

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

11

System Prompt

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