pretendard
v1.3.9
Korean | English | 日本語
Pretendard is a natural font that provides products on cross -platforms and is a natural font in multilingual typography. Pretendards, which are trimmed based on Inter, Bono Dick, and M Plus 1p, do not need to do additional tasks for readability and visual correction in the read environment.
Pretendard is provided in nine thickness, and variable fonts are also supported.
For more information about the background and features of the Pretendard, and OpenTYPE features, you can find it here.
Go down to use a preendard suitable for a specific environment:
You can use Pretendard using CDN, and you can use the CDNJS and UNPKGs in addition to JSDelivr, which is recommended by default and recommended by default.
Use the code below to use Pretendard as a web font. The FONT-FAMILY name used is Pretendard .
< link rel =" stylesheet " as =" style " crossorigin href =" https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://unpkg.com/[email protected]/dist/web/static/pretendard.css " /> @import url ( "https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css" ); @import url ( "https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.min.css" ); @import url ( "https://unpkg.com/[email protected]/dist/web/static/pretendard.css" ); Pretendard provides dynamic subsets in the same way as Hangul fonts provided by Google Fonts as a way to solve web fonts problems. To selectively download the letters included in the page, use the code below to use Pretendard faster. The FONT-FAMILY name used is Pretendard .
< link rel =" stylesheet " as =" style " crossorigin href =" https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard-dynamic-subset.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard-dynamic-subset.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://unpkg.com/[email protected]/dist/web/static/pretendard-dynamic-subset.css " /> @import url ( "https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard-dynamic-subset.min.css" ); @import url ( "https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard-dynamic-subset.min.css" ); @import url ( "https://unpkg.com/[email protected]/dist/web/static/pretendard-dynamic-subset.css" ); Variable dynamic subsets can be used as a variable weight attribute and preendard with a significantly less capacity than conventional dynamic sub. Use the code below to use Pretendard more comfortably in modern browsers. The FONT-FAMILY name is "Pretendard Variable" .
< link rel =" stylesheet " as =" style " crossorigin href =" https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable-dynamic-subset.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/variable/pretendardvariable-dynamic-subset.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://unpkg.com/[email protected]/dist/web/variable/pretendardvariable-dynamic-subset.css " /> @import url ( "https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable-dynamic-subset.min.css" ); @import url ( "https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/variable/pretendardvariable-dynamic-subset.min.css" ); @import url ( "https://unpkg.com/[email protected]/dist/web/variable/pretendardvariable-dynamic-subset.css" ); Use the code below to use the variable weight attribute. The FONT-FAMILY name is "Pretendard Variable" .
< link rel =" stylesheet " as =" style " crossorigin href =" https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/variable/pretendardvariable.min.css " /> < link rel =" stylesheet " as =" style " crossorigin href =" https://unpkg.com/[email protected]/dist/web/variable/pretendardvariable.css " /> @import url ( "https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable.min.css" ); @import url ( "https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/variable/pretendardvariable.min.css" ); @import url ( "https://unpkg.com/[email protected]/dist/web/variable/pretendardvariable.css" );If you want to match the system as much as possible, we recommend the FONT-FAMILY configuration below.
font-family : -apple-system , BlinkMacSystemFont , "Apple SD Gothic Neo" , "Pretendard Variable" , Pretendard , Roboto , "Noto Sans KR" , "Segoe UI" , "Malgun Gothic" , "Apple Color Emoji" , "Segoe UI Emoji" , "Segoe UI Symbol" , sans-serif;If you want to have the same environment anywhere, we recommend the following font-family configuration.
font-family : "Pretendard Variable" , Pretendard , -apple-system , BlinkMacSystemFont , system-ui , Roboto , "Helvetica Neue" , "Segoe UI" , "Apple SD Gothic Neo" , "Noto Sans KR" , "Malgun Gothic" , "Apple Color Emoji" , "Segoe UI Emoji" , "Segoe UI Symbol" , sans-serif;Pretendard is available in the following package manager.
npm i pretendardyarn add pretendardPretendard is installed on the device and can be used as a system font.
brew tap homebrew/cask-fonts
brew install font-pretendard # configuration.nix
{
fonts . packages = with pkgs ; [
pretendard
] ;
}yay -S otf-pretendard
yay -S ttf-pretendardYou can use Pretendard using local fonts in Next.js.
import localFont from 'next/font/local'
const pretendard = localFont ( {
src : './fonts/PretendardVariable.woff2' ,
display : 'swap' ,
weight : '45 920' ,
} ) If you do not specify the weight options, be careful because the thickness may be wrong in the webkit -based browser.
Inter: Rasmus Andersson
Source haan Sans: Adobe, Google, Sandol Communication; Jang Soo -young, Kang Joo -yeon
M plus 1p: underforest design; Coji Morishita
Gil Hyungjin
Pretendard is distributed to SIL Open Font License. All commercial behaviors, modifications, and redistributions are possible except font sales.
Thank you very much for supporting the Pretendard project to continue to make it smoothly.
Thank you very much for contributing to Pretendard.
@hiddenest: We have worked on web font serving and CDN update automation, subsex and dynamic subset, and variable dynamic sub -set automation.
@leejh10003: You made an example of using Pretendard.
@Black7375: All Webfont Build Automation, Publish and Release File Creation Automation on NPMJS and YARN, CDN URLs, Improvement of buzzing, monorepo response, build performance improvement, and preendard GOV CDN documentation.
@victorrica: You have worked on the distribution of npm and yarn packages.
@kms0219kms: All web font CDN distribution multiplexing, document development improvement, and English and Japanese documentation.
@Gamssake: You have improved build automation.
@quiple: You have improved the translation of Japanese readme.
@sudosubin: Homebrew-CASK-FONTS and Nix have been added.
New improvement opinions are always welcome. If you need a solution, please register the issue in ISSUES.
