문서 / specs/002-site-typography-scale/contracts/typography-ui-contract.md

UI Contract: 타이포그래피 크기와 반응형 동작

글자 크기와 반응형 동작의 계약.

계산 크기 계약

역할 대표 선택자 375px 1440px 이상
기본 본문 body 16px 이상 17px 이하
H1 h1 40px 이상 72px 이하
H2 h2 28px 이상 44px 이하
H3 h3 18px 이상 22px 이하
히어로 리드 .atlas-hero__lead, .guide-hero > p:last-child, .evidence-hero__lead, .roadmap-hero__lead 17px 이상 20px 이하
성숙도 점수 .maturity-score__number strong 56px 이상 96px 이하

범위 안의 중간 화면에서는 각 역할의 계산 크기가 화면 너비 증가에 따라 감소하지 않아야 한다. 페이지별 조밀한 카드 제목은 역할 범위 안에서 더 작은 고정값을 유지할 수 있다.

보호되는 작은 텍스트

역할 최소값
기술 라벨 11px
사이트 내비게이션 15px
상태 배지·메타데이터·코드 기존 선언값, 최소 12px

레이아웃 계약

  • 대상 경로는 /, /guide, /5240lab, /roadmap과 임의의 404 경로다.
  • 375px, 720px, 768px, 1440px에서 제목과 리드가 보이고 자체 경계를 벗어나지 않아야 한다.
  • 각 화면에서 scrollWidth - clientWidth는 1px 이하여야 한다.
  • 다크 모드와 인쇄 매체는 기본 화면과 동일한 계산 글자 크기를 유지해야 한다.
  • 제목 순서, 콘텐츠, 링크, 필터, 상태 텍스트와 키보드 동작은 변경되지 않아야 한다.