Skip to content

Commit 7ddf0fc

Browse files
buppagibuppagi
committed
한나체 프로, 한나체 air추가
1 parent 06764de commit 7ddf0fc

20 files changed

+9117
-36
lines changed

‎README.md‎

Lines changed: 65 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,93 @@
11
# 웹폰트(Webfont)
22
무료 폰트를 웹폰트로 사용하기
33

4-
> 제 개인적인 사용이 목적이이며, 정식 웹폰트가 나올시에는 그것을 사용해주시길 바랍니다.
5-
나눔고딕은 [구글웹폰트][nanum]을 사용해주시길 바랍니다.
4+
> 비상업용 목적이며, 상업용으로 사용하실 때는 각 라이센스를 확인 후 사용하시길 바랍니다.
5+
> 각 폰트는 각 회사의 라이센스에 따라 저작권이 있으니 참고부탁드립니다.
66
77
## 나눔글꼴
88
네이버에서 만들어 무료로 배포한 나눔글꼴을 웹폰트로 만들었습니다.
9-
[나눔글꼴이야기 PDF 보기][nanum story]
10-
11-
12-
### 니눔바른고딕
9+
[나눔글꼴이야기 PDF 보기](http://static.campaign.naver.com/0/hangeul/2014/doc/nanum_story.pdf)
1310

11+
### 나눔바른고딕
1412
HTML 문서에 적용:
1513
```html
16-
<style type="text/css">
17-
.text {font-family: 'NanumBarunGothic', '나눔바른고딕', sans-serif;}
18-
</style>
14+
<link href="//fonts.googleapis.com/earlyaccess/NanumBarunGothic.min.css" rel="stylesheet" type="text/css" />
15+
```
16+
CSS:
17+
```css
18+
.text {font-family: 'NanumBarunGothic', '나눔바른고딕', sans-serif}
19+
```
20+
21+
### 나눔스퀘어라운드
22+
HTML 적용
23+
```html
24+
<link href="//fonts.googleapis.com/earlyaccess/NanumSquareRound.min.css" rel="stylesheet" type="text/css" />
25+
```
26+
CSS:
27+
```css
28+
.text {font-family: 'NanumSquareRound', Arial, sans-serif}
1929
```
2030

2131
## 우아한 형제들
32+
주아체, 한나체, 도현체, 연성체, 키랑해랑체는 구글 웹폰트가 있어서 공유합니다.
33+
34+
HTML `<head>`
35+
```html
36+
<!-- 한나 -->
37+
<link href="https://fonts.googleapis.com/earlyaccess/hanna.css" rel="stylesheet" type="text/css" />
38+
<!-- 주아 -->
39+
<link href="https://fonts.googleapis.com/css2?family=Jua&display=swap" rel="stylesheet">
40+
<!-- 도현 -->
41+
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
42+
<!-- 연성체 -->
43+
<link href="https://fonts.googleapis.com/css2?family=Yeon+Sung&display=swap" rel="stylesheet">
44+
<!-- 키랑 해랑체-->
45+
<link href="https://fonts.googleapis.com/css2?family=Kirang+Haerang&display=swap" rel="stylesheet">
46+
```
47+
CSS:
48+
```css
49+
.text1 { font-family:'Jua', sans-serif; } /* 주아체 */
50+
.text2 { font-family:'Hanna', sans-serif; } /* 한나체 */
51+
.text3 {font-family: 'Do Hyeon', sans-serif;} /* 도현체 */
52+
.text4 {font-family: 'Yeon Sung', cursive;} /* 연성체 */
53+
.text5 {font-family: 'Kirang Haerang', cursive;} /* 키랑 해랑체 */
54+
```
2255

23-
웹사이트 HTML문서의 ``<head>``안에 아래 코드를 넣으면 됩니다.
56+
### 배민 한나체 Pro
57+
HTML:
58+
```html
59+
<link href="https://cdn.jsdelivr.net/gh/buppagi/webfonts/css/BMHANNAPro.min.css" rel="stylesheet" type="text/css" />
60+
```
61+
### 배민 한나체 Air
62+
HTML:
63+
```html
64+
<link href="https://cdn.jsdelivr.net/gh/buppagi/webfonts/css/BMHANNAAir.min.css" rel="stylesheet" type="text/css" />
65+
```
66+
67+
## 웹폰트 모두 사용하기
68+
소개한 웹폰트를 모두 사용하시려면 **styles.css**를 사용하시면 됩니다.
2469

25-
**Tag 사용**
70+
HTML:
2671
```html
27-
<link href="https://cdn.jsdelivr.net/gh/buppagi/webfonts/style.css" rel="stylesheet" type="text/css" />
72+
<link href="https://cdn.jsdelivr.net/gh/buppagi/webfonts/css/styles.min.css" rel="stylesheet" type="text/css" />
2873
```
2974

3075
**@import 사용**
3176
CSS파일 및 ``<head>``안의 스타일 시트에 아래 코드를 넣으면 됩니다.
3277
```css
33-
@import url('https://cdn.jsdelivr.net/gh/buppagi/webfonts/style.css');
34-
```
78+
@import url('https://cdn.jsdelivr.net/gh/buppagi/webfonts/css/style.min.css');
3579

36-
## 적용하기
37-
폰트를 적용하려면 폰트 이름을 적용하길 원하는 CSS에 다음과 같이 추가하면 됩니다.
38-
```css
39-
font-family: 'NanumBarunGothic', '나눔바른고딕', sans-serif;
80+
/* 폰트를 적용하려면 폰트 이름을 적용하길 원하는 CSS에 다음과 같이 추가하면 됩니다. */
81+
.font{font-family: 'NanumBarunGothic', '나눔바른고딕', sans-serif;}
4082
```
4183

42-
## HTML문서에 적용
43-
```html
44-
<style type="text/css">
45-
.jua { font-family:'BM JUA','배달의민족 주아',sans-serif; }
46-
.hana{ font-family:'BM HANNA','배달의민족 한나', sans-serif; }
47-
.nanumsr{ font-family:'NanumSquareRound', sans-serif; }
48-
</style>
49-
```
5084

51-
* 개인적으로 사용함을 위해 만든만큼 업데이트가 느릴 수 있고, 적용이 안될 수 있습니다.
52-
적용이 안될 시에는 피드백 부탁드립니다.
85+
* 개인적으로 사용함을 위해 만든만큼 업데이트가 느릴 수 있고, 적용이 안될 수 있습니다.*
5386

87+
88+
* 적용이 안될 시에는 피드백 부탁드립니다.*
5489
## 피드백
55-
[Issues][issues]로 해주시면 됩니다.
90+
[Issues](https://github.com/buppagi/webfonts/issues)로 해주시면 됩니다.
5691

5792
## 라이센스
58-
59-
- 배달의민 족 [라이센스 보기](https://github.com/buppagi/LICENSE/WOOWAHANLICENSE)
60-
- 주아체 [라이센스 보기](https://help.naver.com/support/contents/contents.help?serviceNo=1074&categoryNo=3497)
61-
62-
[nanum]: http://fonts.googleapis.com/earlyaccess/nanumgothic.css
63-
[nanum story]: http://static.campaign.naver.com/0/hangeul/2014/doc/nanum_story.pdf
64-
[issues]: https://github.com/buppagi/webfonts/issues
93+
- 나눔폰트 [라이센스 보기](https://help.naver.com/support/contents/contents.help?serviceNo=1074&categoryNo=3497)

‎css/BMHANNAAir.css‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
@charset "UTF-8";
2+
/* 배민한나체AIR 웹폰트 */
3+
@font-face {
4+
font-family: "BMHANNAAir";
5+
font-style: normal;
6+
font-weight: normal;
7+
src: local("BMHANNAAir"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.svg#BMHANNAAir") format("svg"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.ttf") format("truetype");
8+
}

‎css/BMHANNAAir.min.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
@charset "UTF-8";
2+
/*!
3+
* webfonts - 무료 한글 폰트를 웹폰트로 사용하기
4+
* @link https://buppagi.com
5+
* BMHANNAAir.css
6+
*/
7+
@font-face{font-family:"BMHANNAAir";font-style:normal;font-weight:normal;src:local("BMHANNAAir"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.eot"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.eot?#iefix") format("embedded-opentype"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.woff2") format("woff2"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.woff") format("woff"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.svg#BMHANNAAir") format("svg"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAAir.ttf") format("truetype")}

‎css/BMHANNAPro.css‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
@charset "UTF-8";
2+
/* 배민한나체Pro 웹폰트 */
3+
@font-face {
4+
font-family: "BMHANNAPro";
5+
font-style: normal;
6+
font-weight: normal;
7+
src: local("BMHANNAPro"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.svg#BMHANNAPro") format("svg"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.ttf") format("truetype");
8+
}

‎css/BMHANNAPro.min.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
@charset "UTF-8";
2+
/*!
3+
* webfonts - 무료 한글 폰트를 웹폰트로 사용하기
4+
* @link https://buppagi.com
5+
* BMHANNAPro.css
6+
*/
7+
@font-face{font-family:"BMHANNAPro";font-style:normal;font-weight:normal;src:local("BMHANNAPro"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.eot"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.eot?#iefix") format("embedded-opentype"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.woff2") format("woff2"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.woff") format("woff"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.svg#BMHANNAPro") format("svg"),url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/BMHANNAPro.ttf") format("truetype")}

‎css/NanumBarunGothic.css‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
@charset "UTF-8";
2+
/* 나눔바른고딕 웹폰트 */
3+
@font-face {
4+
font-family: "NanumBarunGothic";
5+
font-style: normal;
6+
font-weight: 400;
7+
src: local("NanumBarunGothic"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.ttf") format("truetype");
8+
}
9+
10+
@font-face {
11+
font-family: "NanumBarunGothic";
12+
font-style: normal;
13+
font-weight: 700;
14+
src: local("NanumBarunGothic"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.svg#NanumBarunGothic") format("svg"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumBarunGothic.ttf") format("truetype");
15+
}

‎css/NanumBarunGothic.min.css‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎css/NanumSquareRound.css‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
@charset "UTF-8";
2+
/* 나눔스퀘어라운드 웹폰트 */
3+
@font-face {
4+
font-family: "NanumSquareRound";
5+
font-style: normal;
6+
font-weight: 300;
7+
src: local("NanumSquareRound"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundL.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundL.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundL.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundL.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundL.ttf") format("truetype");
8+
}
9+
10+
@font-face {
11+
font-family: "NanumSquareRound";
12+
font-style: normal;
13+
font-weight: 400;
14+
src: local("NanumSquareRound"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundR.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundR.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundR.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundR.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundR.ttf") format("truetype");
15+
}
16+
17+
@font-face {
18+
font-family: "NanumSquareRound";
19+
font-style: normal;
20+
font-weight: 700;
21+
src: local("NanumSquareRound"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundB.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundB.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundB.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundB.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundB.ttf") format("truetype");
22+
}
23+
24+
@font-face {
25+
font-family: "NanumSquareRound";
26+
font-style: normal;
27+
font-weight: 800;
28+
src: local("NanumSquareRound"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundEB.eot"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundEB.eot?#iefix") format("embedded-opentype"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundEB.woff2") format("woff2"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundEB.woff") format("woff"), url("https://cdn.jsdelivr.net/gh/buppagi/webfonts/fonts/NanumSquareRoundEB.ttf") format("truetype");
29+
}

‎css/NanumSquareRound.min.css‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)