더보기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
@font-face {
font-family: "NanumSquareNeo-Variable";
src: url("NanumSquareNeo-Variable.woff2") format("woff2");
font-weight: 100 900;
font-style: normal;
}
@font-face {
font-family: "Pretendard-Variable";
src: url("PretendardVariable.woff2") format("woff2");
font-weight: 100 900;
font-style: normal;
}
body {
display: flex;
}
.nanum {
font-family: "NanumSquareNeo-Variable";
}
.pretendard {
font-family: "Pretendard-Variable";
}
</style>
</head>
<body>
<div class="nanum">
<p>NanumSquareNeo 가변 글꼴</p>
<p style="font-weight: 100; font-variation-settings: 'wght' 100">
Font Test 100
</p>
<p style="font-weight: 200; font-variation-settings: 'wght' 200">
Font Test 200
</p>
<p style="font-weight: 300; font-variation-settings: 'wght' 300">
Font Test 300
</p>
<p style="font-weight: 400; font-variation-settings: 'wght' 400">
Font Test 400
</p>
<p style="font-weight: 500; font-variation-settings: 'wght' 500">
Font Test 500
</p>
<p style="font-weight: 600; font-variation-settings: 'wght' 600">
Font Test 600
</p>
<p style="font-weight: 700; font-variation-settings: 'wght' 700">
Font Test 700
</p>
<p style="font-weight: 800; font-variation-settings: 'wght' 800">
Font Test 800
</p>
<p style="font-weight: 900; font-variation-settings: 'wght' 900">
Font Test 900
</p>
</div>
<div class="pretendard">
<p>Pretendard 가변 글꼴</p>
<p style="font-weight: 100">Font Test 100</p>
<p style="font-weight: 200">Font Test 200</p>
<p style="font-weight: 300">Font Test 300</p>
<p style="font-weight: 400">Font Test 400</p>
<p style="font-weight: 500">Font Test 500</p>
<p style="font-weight: 600">Font Test 600</p>
<p style="font-weight: 700">Font Test 700</p>
<p style="font-weight: 800">Font Test 800</p>
<p style="font-weight: 900">Font Test 900</p>
</div>
</body>
</html>
브라우저 테스트
| 크롬 | 엣지 | 파이어폭스 | 사파리 | |
| 윈도우11 | X 124.0.6367.156(공식 빌드) (64비트) |
X 버전 124.0.2478.80 (공식 빌드) (64비트) |
O 125.0.3 (64-비트) |
|
| m1 맥북 | O 124.0.6367.156(arm64) |
O 124.0.2478.80 (공식 빌드) (arm64) |
O 125.0.3 (64-비트) |
O 17.0(19616.1.27.211.1) |
버전 122.0.6261.129(공식 빌드) (64비트)
버전 123.0.6312.59(공식 빌드) (64비트)
123.0.6312.106(공식 빌드) (64비트)
버전 123.0.6312.123(공식 빌드) (64비트)
버전 124.0.6367.61(공식 빌드) (64비트)
버전 124.0.6367.92(공식 빌드) (64비트)
버전 124.0.6367.119(공식 빌드) (64비트)
크로미움
버전 123.0.6312.123(공식 빌드) (64비트)
버전 124.0.6367.61(공식 빌드) (64비트)
