탐색Landing개발자 도구 랜딩 히어로 — 그로테스크·이탤릭 세리프 혼용

1 / 1

밝은 히어로에 대형 혼합 서체 헤드라인이 놓이고, 아래에서 겹쳐 올라온 제품 스크린샷에 아이콘 사이드바·탭·활동 타임라인·코드 diff가 보이는 랜딩 화면이다.

Landing

개발자 도구 랜딩 히어로 — 그로테스크·이탤릭 세리프 혼용

2026-09-01 · 이미지 1

AI 분석

밝은 배경 위 대형 헤드라인과 제품 스크린샷이 겹치는 개발자 도구 랜딩 히어로다.

상단 고정 내비게이션 아래 좌측 정렬 대형 헤드라인이 놓이고, 그 아래로 제품 스크린샷이 화면 하단을 향해 풀블리드로 겹쳐 들어오는 단일 칼럼 히어로다. 타이포그래피는 굵은 그로테스크 산세리프에 한 단어만 이탤릭 세리프로 바꿔 대비를 만들고, 색은 오프화이트 바탕과 먹색 텍스트를 기본으로 옅은 대각 해칭 패턴과 분홍·라벤더 그라데이션 워시를 얇게 깔아 밝기를 유지한다. 스크린샷 안에는 아이콘 레일 사이드바, 좌측 메타 목록, 탭 전환, 타임라인형 활동 로그, 적·녹 배경의 코드 diff 블록이 들어가 제품 구조를 한 장으로 보여준다. 본문 카피 상당 부분이 회색 블록으로 의도적으로 가려져 있어 공개 전 티저 성격이 강하다. 밝은 톤에서 정보 밀도가 높은 앱 화면을 마케팅 히어로에 자연스럽게 얹는 방식의 참고로 유용하다.

minimal · light-mode · editorial · high-contrast