1. otf 파일 다운받기
2. woff 또는 eot 파일로 변환하기
다른 브라우저에서도 나오게 하려면 이 과정이 필요하다고 한다.
https://anyconv.com/ko/ttf-to-eot-byeonhwangi/
온라인에서 TTF를 EOT로 변환하십시오 - AnyConv
AnyConv는 5 성급 TTF EOT 변환기입니다 ⭐ 온라인에서 ttf를 eot로 몇 초 안에 변환하십시오 👍 소프트웨어 설치가 필요하지 않습니다 👍 무료로 👍 완전히 안전합니다. TTF를 EOT로 쉽게 변경할 수
anyconv.com
3. src 폴더 내에 font 폴더 만들기
4. font 폴더 내에 woff 파일 넣기
5. font 폴더 내에 font.css 파일 만들기
@font-face {
font-family: "Noto Sans KR";
font-style: normal;
font-weight: lighter;
src: url("./NotoSansKR-Thin.woff") format("woff");
}
6. index.js (ts든... tsx.든...jsx든....) 에서 font.css 파일 import 하기
import "./font/font.css";
7. 사용할 때는 font-family 이름에 5번에 적용할 때 쓴 폰트 이름을 입력하면 된다.
'Library-Framework > React' 카테고리의 다른 글
| React 컴포넌트를 어떻게 만들어야 할까? (0) | 2024.01.20 |
|---|---|
| 🌟 외부 라이브러리 없이 별점 평점 기능 만들기 (0) | 2023.12.29 |
| [React] Google Map Polygon 바로 띄우기 (0) | 2023.04.03 |
| [React] Google Map default zoom 바로 안 먹힘 (0) | 2023.04.03 |
| [React] React에서 Google Map API 사용하기 & Polygon 그리기 (0) | 2023.02.19 |
