ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

Outfit字体:9种字重的几何无衬线字体,免费商用的选型与上手指南

Outfit字体:9种字重的几何无衬线字体,免费商用的选型与上手指南 Outfit字体9种字重的几何无衬线字体免费商用的选型与上手指南【免费下载链接】Outfit-FontsThe most on-brand typeface项目地址: https://gitcode.com/gh_mirrors/ou/Outfit-FontsOutfit 是一套 OFL 协议的几何无衬线字体家族包含从 Thin 到 Black 共 9 种字重。免费商用提供 TTF、OTF、WOFF2 与可变字体四种格式适合网页开发者、UI 设计师与品牌设计师。 Outfit字体格式怎么选按使用场景挑格式不必全装使用场景推荐格式项目内位置桌面设计软件TTFfonts/ttf/打印输出OTFfonts/otf/网页WOFF2fonts/webfonts/网页可变字重可变字体fonts/variable/拿不准就先装 fonts/ttf/ 下的 TTF覆盖大多数桌面场景。⚡ Outfit字体安装步骤从克隆到验证克隆仓库git clone https://gitcode.com/gh_mirrors/ou/Outfit-Fonts安装字体把fonts/ttf/*复制到系统字体目录Windows 直接右键 TTF 安装刷新缓存Linux 执行fc-cache -f验证结果在设计软件或浏览器中搜索 “Outfit”应出现 9 种字重 Outfit字体网页配置网页只需 WOFF2 格式体积比 TTF 小按实际用到的字重逐个声明font-face { font-family: Outfit; src: url(Outfit-Regular.woff2) format(woff2); font-weight: 400; font-display: swap; } body { font-family: Outfit, sans-serif; }把 fonts/webfonts/ 中用到的 woff2 文件放进网站静态目录声明 Bold 时换文件名并将字重改为 700 即可。Outfit字体界面设计字重用法正文用 Regular 400行高设为 1.51.6 倍字号次级标题与按钮文字用 SemiBold 600主标题用 Bold 700 或 ExtraBold 800辅助说明与装饰性文字用 Light 300、Thin 100Outfit字体离线使用复制fonts/ttf或fonts/otf进离线应用如 Electron安装包按路径直接引用无需系统安装在设计软件中搜索家族名 “Outfit”从下拉菜单切换全部 9 种字重印刷输出优先选 OTF轮廓质量更好 Outfit字体进阶玩法Outfit可变字体网页配置可变字体用一个文件装下 9 种字重请求更少还能微调任意字重font-face { font-family: Outfit; src: url(Outfit[wght].woff2) format(woff2-variations); font-weight: 100 900; } h1 { font-variation-settings: wght 750; }Outfit字体源码重建仓库自带源文件 sources/Outfit.glyphs 与 sources/config.yaml可修改字形后本地重建make build # 生成 fonts/ 下的字体文件 make proof # 生成 HTML 预览页许可条款见 OFL.txt。 Outfit字体常见问题与解决软件里看不到字体现象安装后字体列表搜不到 Outfit原因系统字体缓存未刷新解决Linux 执行 fc-cache -f重启软件页面首屏文字闪烁现象文字先显示系统字体加载完再切换原因字体文件加载慢或字重加载过多解决声明 font-display: swap用 WOFF2 且只加载用到的字重字重名称对不上现象部分软件里找不到 “Outfit Light”原因软件按子族名列出而非完整家族名解决搜索家族名 “Outfit”在下拉菜单里选字重9 种字重、免费商用、四种格式齐备克隆安装即可投入项目。用fc-list | grep Outfit可随时验证安装状态。【免费下载链接】Outfit-FontsThe most on-brand typeface项目地址: https://gitcode.com/gh_mirrors/ou/Outfit-Fonts创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表