lxgw-wenkai-webfont
A webfont package for the LXGW WenKai typeface.
For more information about the typeface, see LXGW WenKai's website.
Usage
Use NPM
First, install the package via npm or yarn.
npm install --save lxgw-wenkai-webfont
# or Lite version
npm install --save lxgw-wenkai-lite-webfont
# or TC version
npm install --save lxgw-wenkai-tc-webfont
# or Screen version
npm install --save lxgw-wenkai-screen-webfontThen import style.css to your main css style file and update the font-family.
@import 'lxgw-wenkai-webfont/style.css';
/* Lite version */
@import 'lxgw-wenkai-lite-webfont/style.css';
/* TC version */
@import 'lxgw-wenkai-tc-webfont/style.css';
/* Screen version */
@import 'lxgw-wenkai-screen-webfont/style.css';
body {
font-family: "LXGW WenKai", sans-serif;
/* Lite version */
font-family: "LXGW WenKai Lite", sans-serif;
/* TC version */
font-family: "LXGW WenKai TC", sans-serif;
/* Screen version */
font-family: "LXGW WenKai Screen", sans-serif;
}
/* Mono font (optional) */
pre,code {
font-family: "LXGW WenKai Mono", sans-serif;
/* Lite version */
font-family: "LXGW WenKai Mono Lite", sans-serif;
/* TC version */
font-family: "LXGW WenKai Mono TC", sans-serif;
}Use CDN
Put the jsDelivr <link> into your html head, then update the font-family.
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/style.css" />
<!-- Lite version -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/style.css" />
<!-- TC version -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/style.css" />
<!-- Screen version -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/style.css" />
<style>
body {
font-family: "LXGW WenKai", sans-serif;
/* Lite version */
font-family: "LXGW WenKai Lite", sans-serif;
/* TC version */
font-family: "LXGW WenKai TC", sans-serif;
/* Screen version */
font-family: "LXGW WenKai Screen", sans-serif;
}
</style>
</head>
<body>
<!-- blablabla -->
</body>
</html>Use specific font weights
You can also include specific weights if you don't want to use all the font weights or don't want to use mono font. For example:
@import 'lxgw-wenkai-webfont/lxgwwenkai-regular.css';
@import 'lxgw-wenkai-webfont/lxgwwenkai-bold.css';
body {
font-family: "LXGW WenKai", sans-serif;
}Lite version and TC version also support the same way. To know what css modules are available, please check out the npm package.
License
lxgw-wenkai-webfont © Chawye Hsu. Released under the MIT License.
The LXGW WenKai typeface is available under the SIL Open Font License 1.1 license.
Blog · GitHub @chawyehsu · Twitter @chawyehsu