Roboto 设计与 SVG 导出指南
这份指南帮助你在实时预览之外判断 Roboto 是否真的适合项目，覆盖字形观察、间距选择、屏幕集成和实体加工风险，让下载结果不只是格式正确，而是能直接进入下一步工作流。
字体背景与适用项目
Roboto 最初面向屏幕界面设计，字形在机械秩序与开放的人文曲线之间保持平衡。文字转成路径后，这段设计背景仍然重要：即使接收方没有字体文件，字母的比例和阅读节奏也不会失去熟悉感。它最适合中性、技术化、可信赖的 SVG，而不是强调装饰性的作品。产品标签、仪表盘提示、流程图注释和紧凑型品牌字标都能受益于这种克制。
字形中应重点检查什么
观察 Roboto 的圆形字腔、开放开口和较均匀的笔画灰度，会发现它在小尺寸下仍容易识别。不过，转为路径后也会产生不少需要检查的内部空腔。不要只看全大写预览，小写 a、e、g 更能暴露当前字重缩小时是否会糊成一团。Roboto 通常不需要额外描边来“加粗”；直接选择更重的原生字重，轮廓更干净，拐角也更可控。
Roboto 推荐起始设置
以下数值是实用起点，不是万能预设。请用真实文案、最终尺寸、材料与目标软件复检。
- 标签字重
- 500
- 展示字重
- 700
- 字符间距
- 0 to 0.01em
- 曲线精度
- 中
- 建议最小起点
- 14 px / 3 mm
字重与间距策略
界面标签建议从 500 字重开始，保留字偶距，不额外增加字符距。短字标或徽章可用 700，轮廓更坚定，同时不像 900 那样容易堵住字腔。100 到 300 的细字重适合大尺寸展示，却不适合贴纸、雕刻和会损失细节的加工流程。一定先用最终文案预览再调间距；Roboto 已经包含成熟的字偶距，统一使用负字符距很容易让斜线字母和圆形字母互相挤压。
网页、React 与屏幕工作流
用于网页或 React 时，优先导出填充路径并保留 viewBox，让 CSS 控制显示宽度。静态标签使用合并路径即可；只有逐字动画或交互确实需要时才拆分字符。请在真实界面的最小尺寸和不同浏览器缩放比例下检查，因为大画布上清楚的预览，缩小后可能出现字腔拥挤。如果颜色需要跟随组件主题，可在集成时把 fill 改为 currentColor，不必为每一种颜色重复保存 SVG。
激光、CNC、刻字膜与雕刻
用于激光切割、刻字膜、CNC 或雕刻时，优先选择 700，并在下载前输入最终物理单位。重点检查 A、B、O、P、R 等带封闭空间的字母，再判断工艺是否需要桥位或模板字体。Roboto 本身不是 stencil 字体，做贯穿切割时内部孤岛可能脱落；如果只是雕刻或印刷则没有这个问题。制作独立字牌前，应先确定背板、粘贴或连接方式，再把导出的 SVG 当作生产文件。
何时选择或避开 Roboto
如果希望更像现代数字产品，可比较 Inter；如果需要更亲和的人文节奏，可看 Open Sans；横向空间紧张时可考虑 Roboto Condensed。Roboto 的优势是中性与稳定，弱点也是过于熟悉：奢华、编辑、复古或手作品牌往往需要更有个性的字体。好的 Roboto SVG 不在于加入多少效果，而在于它能否在目标尺寸、目标背景和目标生产方式中保持清楚、紧凑且可预测。
Roboto 下载前复检
下载前用真实短语分别预览 500 和 700，并在计划中的最小尺寸比较。确认字偶距开启、字腔仍开放，也没有用额外描边掩盖字重选择问题。屏幕用途保留 viewBox；实体输出则切换到最终单位，并确定封闭字腔如何固定。把字体与字重记录在主文件旁，保证路径化资产日后仍可准确修改。