폰트 크기 반응형 테스트 페이지

화면 너비 - 픽셀
CSS 폰트 사이즈 - 픽셀
HTML 반영 폰트 - 픽셀
현재 모드 일반 사용자

카드 제목 (1.5rem)

이것은 일반 본문 텍스트입니다. (1rem) 화면 크기와 모드에 따라 폰트 크기가 자동으로 조정됩니다.

보조 설명 텍스트입니다. 더 작은 크기로 표시됩니다. (약 0.78rem)

대제목 샘플 (H1)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. 한글과 영문이 혼합된 텍스트의 가독성을 테스트합니다. 브라우저 창의 크기를 조절하거나, 위의 모드 버튼을 클릭하여 폰트 크기 변화를 확인해보세요.

반응형 테스트 가이드

디바이스별 기본 폰트 크기:

  • 모바일 (~ 767px): 일반 16px / 시니어 18px
  • 태블릿 (768px ~ 1023px): 일반 18px / 시니어 20px
  • 데스크탑 (1024px ~): 일반 20px / 시니어 22px

테스트 방법:

  1. 브라우저 창 크기를 조절하여 디바이스별 변화 확인
  2. 일반/시니어 모드 버튼을 클릭하여 모드별 차이 확인
  3. 개발자 도구(F12)로 실제 계산된 폰트 크기 확인

다양한 크기의 텍스트

2rem 크기 텍스트

1.5rem 크기 텍스트

1rem 크기 텍스트 (기본)

0.875rem 크기 텍스트

description 클래스 텍스트