Wiki 知识库

全部文档 / 标签: 字体

9 篇
清除

中文网站的字体选型配置推荐

文章介绍了中文网站 font-family 的最佳实践:遵循“先西后中、兼顾主流操作系统、最后以通用无衬线字体兜底”的原则。作者给出了 --font-sans 和 --font-mono 两个 CSS 变量配置示例,解释了 Apple 生态、Windows、Android 等系统字体入口的作用,并总结了三条避坑指南:西文字体须写在中文字体之前、中文字体尽量使用英文名称避免编码问题、带空格的字体名必须用双引号包裹。此外还提醒不声明字体时浏览器渲染的是默认字体而非系统字体。

技术 › 前端 RicoUI (@ricouii) 2026-10-231.9 KB 75

AI 设计词典(中篇)|怎么准确描述视觉效果

本文是 AI 设计词典系列的中篇,系统整理了 AI 设计中高频的视觉词汇,帮助用户更精确地控制 AI 生成的视觉效果。文章分为五大维度:字体(衬线/无衬线、字重、字距、行距)、颜色(色相、饱和度、明度、主色/强调色)、形状(几何/有机、圆角/直角、描边)、材质与效果(纹理、渐变、透明度、光影)、风格(极简主义、瑞士风格、粗野主义、编辑设计等)。作者强调不必背诵术语,而应把这些词当作「视觉旋钮」,用「风格名称+具体规则」的方式替代模糊的主观描述,让 AI 输出更符合预期的设计。

技术 › 工具与效率 Morry.AI 2026-10-2316.7 KB 9.8K 165 83

审美提升(下):硅谷设计师都在用的10个UI组件工具库

作者精选10个设计师宝藏资源,覆盖配色(Coolors)、字体、图标、插画、动效、3D设计、图片、CTA按钮、品牌视觉管理和AI交互模式等领域。文章强调审美提升靠日复一日的浸泡,每个资源都附推荐理由与使用建议,帮助读者建立自己的资源库与判断标准,逐步将好设计运用到作品中。

技术 › 前端 Dreameryanyan 2026-10-2217.2 KB 33.1K 198 73

How fonts can sound

文章探讨了字体与音效之间的跨模态对应关系:大脑会自然地将声音、形状等不同感官体验联系起来,高细音对应轻盈锐利的形态,低沉音对应厚重圆润的形态。作者指出音效设计不能机械匹配字体特征,而要结合字体在屏幕上的动画方式(速度、方向、节奏)来选择声音。文中提出一个简单框架:先解读字体特性,再观察动画运动,最后选择同时支持二者的音效。好的音效设计能赋予视觉重量感与真实感,提升整体沉浸感,让观众感受到动画而非仅仅看到动画。

技术 › 前端 Mark Vassilevskiy 2026-10-058.2 KB 21.1K 231 72

40 种适合杂志、海报与 AI 生图的英文字体图鉴(附提示词)——上册

本文整理了40个常用英文字体,聚焦前20种衬线与无衬线字体,讲解如何将字体视觉特征转化为 AI 生图可理解的提示词。作者指出仅说'高级字体'对AI几乎无效,应采用'字体名+类别+笔画特征+字形比例+时代氛围+使用场景'的通用公式,并针对Didot、Bodoni、Helvetica Neue等逐一给出适用场景与完整英文提示词,涵盖时尚杂志、奢侈品、书籍、海报等多种应用,帮助用户精准控制AI生图中的字体风格。

技术 › AI生图 Adrian Punk 2026-09-039.5 KB 49.7K 203 80

AI 不是没审美,只是不懂方块字

文章探讨 AI 生成中文页面排版难看的根本原因:不是审美问题,而是语言结构问题。作者指出 AI 默认的 CSS 参数(负字距、1.4 行高、Inter 字体栈)都是为拉丁文设计的,而汉字等宽、信息密度高、可用的层级手段少,与字母排版从根上不同。文章分析了标题过长、断行不当、细字重浅灰、照搬多列网格等常见症状,并给出可直接使用的排版处方:正文 16–18px、行高 1.75–2.0、字距为 0、一行 30–45 字、字体栈首位用 PingFang SC,以及给 AI 修改中文排版的速查表。

技术 › 前端 Su 2026-09-035.8 KB 13K 91 85

个人网页设计建议:留白、突出重点与个人风格

作者针对小伙伴们个人网页普遍内容过满、缺乏重点的问题,结合自身 UI 设计经验提出九条建议:一是留出空白,让首屏清晰传达“你是谁、做什么”;二是把成熟项目和成果前置;三是配色先确定风格,强调色克制使用;四是重视字体对气质的影响,区分字号字重;五是让 AI 少用千篇一律的卡片布局;六是融入个人小巧思;七是广泛浏览设计参考积累审美;八是动效克制并注意移动端适配;九是可加轻量音效彩蛋。核心观点是个人网页应体现个人风格,删繁就简。

技术 › 前端 yuu (@yuudecideall) 2026-08-217.1 KB 75

Giant Type Turns the Whole Poster into Space

本文展示了如何利用巨型字体将海报设计成空间的一部分,通过字符重叠、穿插和融入场景,使排版成为视觉叙事的关键元素。作者提供了多个案例(如 STATIC YOUTH、AFTERLIGHT 等),并分享了使用 GPT-Image2 生成此类海报的详细提示词模板,涵盖主题、标题、人物、背景、色彩、字体行为等参数,适用于乐队海报、家庭肖像、品牌活动、活动视觉和编辑设计等场景。