폰트 성능

폰트 로딩 CSS 어드바이저

@font-face나 폰트 링크를 붙여 넣어 preload, font-display, 포맷, 서브셋을 확인하고 LCP 지연과 CLS를 줄입니다.

대기0/100
패밀리0
@font-face0
Preload0
이슈0

폰트 CSS 또는 HTML

@font-face, Google Fonts 링크, @import 또는 document head를 붙여 넣으면 입력과 동시에 로컬 분석됩니다.

CSS는 이 브라우저에만 남으며 업로드되지 않습니다.

감지된 패밀리

@font-face와 원격 폰트 스타일시트에서 묶습니다.

폰트를 선언한 CSS나 HTML을 붙여 넣으면 목록이 나타납니다.

권장 @font-face

WOFF2를 셀프 호스트하고 font-display와 라틴 unicode-range를 넣으세요. 경로는 실제 파일에 맞추세요.

권장 preload

텍스트 폰트는 최대 두 개만 preload하세요. 폰트 파일에는 반드시 crossorigin이 필요합니다.