可直接删除上方字符并输入预览。
语种预览
简体中文
拉丁字母
阿拉伯数字
授权范围
字体按照协议可根据 OFL-1.1(openfontlicense.org) 获取授权许可。
嵌入字体
常规的引入方式,使用 CSS 或 <style> 。
@import url("https://fontsapi.zeoseven.com/84/main/result.css"); body { font-family: "Douyin Sans"; font-weight: normal; }
使用 HTML 实现标准的预载和冗余措施。
<link rel="preconnect" href="https://fontsapi.zeoseven.com" crossorigin /> <link rel="stylesheet" href="https://fontsapi.zeoseven.com/84/main/result.css" onerror="this.href='https://fontsapi-storage.zeoseven.com/84/main/result.css'" /> <style> body { font-family: "Douyin Sans"; font-weight: normal; } </style>
在加载空闲时预取,完成后转为 stylesheet ,实现无阻塞渲染和冗余措施。
<link rel="preload" as="style" crossorigin href="https://fontsapi.zeoseven.com/84/main/result.css" onload="this.rel='stylesheet'" onerror="this.href='https://fontsapi-storage.zeoseven.com/84/main/result.css'" /> <noscript> <link rel="stylesheet" href="https://fontsapi.zeoseven.com/84/main/result.css" /> </noscript> <style> body { font-family: "Douyin Sans"; font-weight: normal; } </style>
使用 JS 引入字体实现无阻塞渲染和冗余措施,适合 React / Vue3 等客户端路由场景。
/* * ZSFT 冗余器 Version 3.1 (LICENSE: MIT, by 秋, zeoseven.com) * L1 不可用时由 L2 提供文件,使用 fetch HEAD 已确保框架兼容性 * ECMAScript 2015+ (ES6+) */ const __zsftCss = `body { font-family: "Douyin Sans", system-ui, sans-serif }`; // 可以将 __zsftCss 删除变为 undefined ,因为它实际上就是在 head 插入 style ,删除后在其它位置定义正确的 font-family 即可。 ((z, s, f, t) => { setTimeout(()=>{ z=document.head;if(typeof __zsftCss!='undefined')z.insertBefore(document.createElement("style"),(z.firstChild)).innerHTML=__zsftCss; f=(i)=>{return "https://static"+i+"zeoseven.com/zsft/519/main/result.css";}; t=(i)=>{const t=document.createElement("link");t.rel="stylesheet";t.href=i;t.onerror=()=>z.removeChild(t);z.insertBefore(t,(z.firstChild));}; const o=f(s),u=f("-host."); try{fetch(o,{method:"HEAD"}).then(r=>r.status>299?t(u):t(o)).catch(t(u));}catch{t(u)}; }); })(0,".");
让大体积字体像英文字体一样,只需要加载 10KB 左右的文件。
/* * ZSFT 英文子集化选项 * AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890 ,.!?:;- */ @font-face { font-family: "zsft-enmin-84"; src: url("https://fontsapi.zeoseven.com/84/main.woff2") format('woff2'), url("https://fontsapi-storage.zeoseven.com/84/main.woff2") format('woff2'); unicode-range: U+0061-007A, U+0041-005A, U+0030-0039, U+002E, U+002C, U+0021, U+003F, U+003A, U+003B, U+002D; } body { font-family: "zsft-enmin-84"; font-weight: normal; }
感到困惑?我们提供了 帮助与支持 其中的 嵌入字体的方法 以及关于 违法违规内容的定义和处理措施。
Font files available from ByteDance Fonts
DouyinSans 抖音美好体
"DouyinSans" is the official font released by the Douyin Brand Creative Center. It holds full intellectual property rights and is open source to the public.It includes a total of 6,763 Chinese characters and 682 alphanumeric and punctuation symbols. The font style is simple and concise, full and comfortable, both rigid and flexible, thick and upright, providing a good user reading experience and visual impression. It not only conveys Douyin's brand message of "Capturing the Beautiful Life" but also better meets the creative demands of Douyin creators. Everyone is welcome to use it!
“抖音美好体”是抖音品牌创意中心推出的抖音官方字体,具有完全知识产权且对外开源。 一共包含6763个汉字以及682个数字西文符号,字体风格简洁凝练、饱满舒适、刚柔并济、厚重挺拔,具有较好的用户阅读体验和视觉感受,不仅传递出抖音“记录美好生活”的品牌主张,同时更好地满足了抖音创作者的创作诉求,欢迎大家使用!
github.com/bytedance/fonts
随机推荐
简体中文
拉丁字母
繁体中文
日文
韩文