본문 바로가기
PROGRAMMING CODE/Web

[React] 폰트 적용하기

by daye_ 2022. 8. 28.

 

 

1. 먼저 해당 링크를 통해 마음에 드는 폰트를 찾는다.

 

눈누

상업용 무료한글폰트 사이트

noonnu.cc

 

 

2. 라이선스에 웹사이트가 포함되어있는지 확인한다.

 

 

3. 리액트 파일에 넣기

 

 

4. 다음과같이 코드 확인시켜주기 font-family 는 이름을 지정해주는것

@font-face {
  font-family: "diary";
  src: url("./fonts/EF_Diary.ttf");
}

 

 

 

5. css에 추가하기

.font {
  color : #AFAFAF;
  height : 20vh;
  font-family: "diary"; << 이거처럼 지정해준 폰트 이름을 넣어주면 됨
}

 

 

 

6. 완성 !

<a className = "font">
    폰트를 적용해 보아요
</a>