NextJS 프리텐다드(Pretendard) 폰트 적용

석준·2025년 2월 19일
0
post-thumbnail

NextJS 15에서 LocalFont 적용하기

pretandard : https://cactus.tistory.com/306

1. 적용

글꼴 다운로드 후 web - variable - woff2 에 있는 PretendardVariable.woff2 파일을 app 폴더의 fonts 폴더를 만들어 옮겨 줍니다. (fonts 폴더는 app 폴더 안에 있어도 관계 없습니.)

그 다음 루트 폴더의 layout.tsx에서 다음과 같이 작성합니다.

weight 옵션을 지정하지 않으면 WebKit 기반의 브라우저에서 굵기가 잘못 렌더링 될 수 있으니 주의해 주세요.

2. 비교

첫번째가 NextJS 설치 시, 기본으로 제공되는 폰트이고
두번째가 Pretendard 폰트입니다.

profile
느려도 꾸준하게, 나를 의심하지 말자

0개의 댓글