当前位置: 首页 > news >正文

Outfit 开源几何字体:9 种字重、4 种格式,免费商用即装即用

Outfit 开源几何字体:9 种字重、4 种格式,免费商用即装即用

【免费下载链接】Outfit-FontsThe most on-brand typeface项目地址: https://gitcode.com/gh_mirrors/ou/Outfit-Fonts

Outfit-Fonts 是 outfit.io 官方开源的几何无衬线字体仓库,OFL 许可证免费商用。它提供 Thin 100 到 Black 900 共 9 种字重,并附带 TTF、OTF、WOFF2 和可变字体四种格式,你的网页或设计软件可以直接取用。

换字体时发现免费字重不够用

给官网换字体的时候,你多半撞过同一堵墙:免费字体大多只有 Regular 和 Bold 两档。想拉开层次——主标题更重、正文标准、辅助说明更轻——手里的字体却只能"全有或全无",只好妥协排版,或者转头去找收费字体。

Outfit-Fonts 把这个问题直接解决了:9 种字重全部开源,从极细的 Thin 到特粗的 Black,随便组合,商用不用掏钱。

仓库里有什么

  • 9 种字重(100-900):日常最常用的是 Light (300)、Regular (400)、SemiBold (600)、Bold (700),其余从极细到特粗按需取用
  • 4 种格式fonts/ttf/装桌面、fonts/otf/给打印、fonts/webfonts/放网页、fonts/variable/存可变字体
  • SIL OFL 1.1 许可:免费商用,可嵌入产品和文档
  • 源文件sources/Outfit.glyphs也在仓库里,改字形不用从零画

九种字重,Thin 到 Black 逐级排开

先拿到文件,再选格式

拿到仓库:

git clone https://gitcode.com/gh_mirrors/ou/Outfit-Fonts

选格式,只看用途:

  • 网页项目 →fonts/webfonts/(WOFF2,体积比 TTF 小 30-50%)
  • 设计软件或系统安装 →fonts/ttf/

装进系统(Linux / macOS 通用):

cp -r fonts/ttf/* /usr/share/fonts/ # 复制到系统字体目录 fc-cache -f # 重建字体缓存

Windows 不用命令行,在fonts/ttf/里右键文件选"安装"即可,效果一样。

网页端怎么配

只需声明实际用到的字重,这里是 Regular 和 Bold 两档的最小配置:

/* Outfit 网页字体:只声明用到的 2 档 */ @font-face { font-family: 'Outfit'; src: url('fonts/webfonts/Outfit-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; /* 先显回退字体,加载完再换,避免文字闪没 */ } @font-face { font-family: 'Outfit'; src: url('fonts/webfonts/Outfit-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; } body { font-family: 'Outfit', system-ui, sans-serif; }

其余 7 种字重照抄这套模板,换文件名和font-weight就行。

设计软件里怎么用

免费商用字体安装完成后,Figma、Illustrator、InDesign 里搜 "Outfit",字重下拉里 9 档齐全。主标题选 Bold (700),正文 Regular (400),辅助信息降到 ExtraLight (200),同一份文档全程只用一个家族,品牌感就统一了。

同一家族内,Bold 与 Thin 的对比张力

进阶:可变字体一个文件搞定

fonts/variable/里那个Outfit[wght].woff2把 9 种字重压进了一个文件:

@font-face { font-family: 'Outfit Variable'; src: url('fonts/variable/Outfit[wght].woff2') format('woff2-variations'); font-weight: 100 900; /* 一个文件覆盖全部字重 */ }

好处很直接:9 个 WOFF2 文件变成 1 次 HTTP 请求;font-weight: 550这种中间值也能输出,不再被整数档位卡住;配合 CSS transition,悬停时字重还能平滑过渡。

避坑清单

  • 装完系统里搜不到字体 → 复制文件后必须跑fc-cache -f,再重启软件
  • 网页字体加载慢 → 只声明真正用到的字重,用 WOFF2 别用 TTF
  • Thin (100) 小字号发虚 → 它只适合大字号装饰,正文至少用 300
  • 浏览器显示的不是 Outfit → 检查font-family名称是否与@font-face里完全一致
  • 软件里出现两个 Outfit → OTF 和 TTF 只装一种,别混装

项目文件导航

Outfit-Fonts/ ├── fonts/ # 现成字体文件 │ ├── ttf/ # 9 字重 TTF,桌面安装用 │ ├── otf/ # OTF 版本 │ ├── webfonts/ # WOFF2 网页字体 │ └── variable/ # 可变字体,wght 100-900 ├── sources/ # Outfit.glyphs 源文件与 config.yaml └── documentation/ # 样张图及生成脚本

构建和测试走Makefilemake build/make test),一般用不到;想自定义字形时从sources/config.yamlOutfit.glyphs入手。

9 种字重、4 种格式、免费商用,仓库里一次拿齐。克隆下来,10 分钟后你的页面或设计稿就能换上 Outfit。

【免费下载链接】Outfit-FontsThe most on-brand typeface项目地址: https://gitcode.com/gh_mirrors/ou/Outfit-Fonts

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

http://www.cnnetsun.cn/news/4156362.html

相关文章:

  • [Unity][VR]Oculus透视开发图文教程1-Passthrough应用XR项目设置
  • NLP工程实践:从体验形成路径优化模型架构与训练技巧
  • 堆叠压力决定电池寿命?
  • 2026年7月通辽市新房价格深度分析报告
  • AI + CRM + 实时搜索,能做出什么样的销售助手?
  • 接口和抽象类的区别
  • sql的执行顺序(经典收藏)
  • Linux tac命令详解:反向查看日志与文本处理实战
  • 京瓷4125输稿器不进纸故障排查与维修指南
  • CMake入门指南:从Hello World到项目构建核心原理
  • 从Demo到生产:语音生成项目工程化落地的四个关键维度
  • 基于SpringBoot的健身服务管理系统毕业设计项目源码
  • NCM 文件打不开?ncmdump 网易云音乐转换工具完整上手指南
  • TCExam实战:从零跑起来到上线的开源在线考试系统
  • C++完美转发:右值引用与引用折叠的实战解析
  • BotW-Save-Manager 实操手册:旷野之息存档 Switch↔Wii U 互转,3 步搞定
  • AI Agent驱动JavaScript代码生成:现代开发工具链的自动化实践
  • HarmonyOS 7.0 / API 26 长列表掉帧排查:懒加载、预取和图片解码怎么配合
  • 多智能体辩论如何提升实体对齐的可靠性与可解释性
  • Git命令行提交代码全流程详解:从核心概念到高级实战
  • 2026年教育行业客户满意度管理系统推荐:满意度问卷逻辑引擎与答题体验优化
  • 从AI Demo到商业闭环:用Qoder构建自动化销售线索跟进系统
  • FlipIt 翻页时钟屏保:闲置屏幕也能看时间
  • C++11右值引用与移动语义:从深拷贝到零成本资源转移
  • Spark/Flink 的 Web UI 不能裸奔:多租户平台的鉴权反向代理设计
  • 2026开题必备|OKBIYE开题报告功能深度实测,解决90%开题难题✅
  • Magpie 窗口放大教程:3 类场景选对缩放算法,老游戏画面立刻变清晰
  • RoPE旋转位置编码:统一绝对与相对位置,提升Transformer长文本建模能力
  • Boss Key 老板键:一键隐藏所有窗口的免费隐私助手
  • LLM Agent记忆安全:ADAM攻击原理与防御实践