React에서 Google font(구글폰트) 적용법

Natest·2023년 8월 29일
0

미세먼지팁

목록 보기
4/6

React에서 Google Font를 적용하는 방법에는 여러 가지가 있습니다.
여기서 가장 간단한 방법은 public/index.html 파일의 head 태그 안에 Google Fonts의 링크 태그를 추가하고, CSS에서 해당 폰트를 적용하는 방법입니다.

우선 Google Fonts에서 원하는 폰트를 선택합니다.

그 다음 public/index.html 파일의 head 태그 안에 아래와 같이 링크 태그를 추가합니다.
Jua 글씨체
Jua 글씨체

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jua&display=swap" rel="stylesheet">

마지막으로 CSS 파일에서 해당 폰트를 적용하면 사용할 수 있습니다.

body {
  font-family: 'Jua', sans-serif;
}

출처 : https://stackoverflow.com/questions/40769551/how-to-use-google-fonts-in-react-js

profile
누군가에게 도움이 될 정보이기를

0개의 댓글