Patrick Visual Language 是作者个人用于 HTML 的视觉风格,定位为“纸笔工程白板”,适合需要手绘、草图感、白板讲解氛围的网页展示。整体由一份核心样式(assets/base.css,含设计令牌与组件)与六个有边界的扩展构成,扩展只调整信息密度和表面质感,始终保留手绘基调。所有资源都放在本目录内,页面不应外部获取字体、网页或文档。
使用方法分五步:先阅读 assets/base.css 和 references/01-grammar.md,写作时同时打开 references/04-anti-patterns.md;根据 references/03-composition.md 中的内容信号选择最小扩展集,只读对应扩展说明;依据 references/02-components.md 的参数,用 assets/snippets/ 中的片段拼装,链接 base.css、复制结构并替换内容;运行 python3 scripts/audit.py <page.html> 和 python3 scripts/render.py <page.html> <out-dir>,迭代到 PASS;最后按 references/05-acceptance.md 的第 3 道关卡对照 assets/examples/canonical-desktop.png 验收。
硬性规则包括:必须原样链接或内联 base.css,不得重定义 --pvl-* 令牌或在页面 CSS 中重新实现组件,新组件需加入 base.css 并提升版本号;每页至少两个不同的手工标记,其中首屏必须有一个(如涂鸦标题、胶带、便利贴、粗糙卡片、色带高亮、铅笔批注),audit.py 会检查并打印这些标记;每屏只用一个焦点强调,每张卡片至多一处高亮、每个区块至多三处;悬停不得展开或显示布局,展开应是整卡点击并配合 aria-expanded;正文不小于 14px,等宽字体不小于 10.5px,可通过 <html data-dense="true"> 将扫描区域切到 10.5–13px;390px 宽度下不得出现横向溢出;墨水色为 #2a2a2a(纸色 #202723),禁止纯黑、品牌渐变、光泽阴影与装饰性动效;表情符号只附着在节点上,不得漂浮在正文中;先编辑再叠加,通过合并、压缩、绘制处理内容,次要材料应放在折叠后、整卡展开或密度开关之后。身份不变量与各扩展可用的自由度写于 references/01-grammar.md 和 references/extensions/;生产修正先进入 references/04-anti-patterns.md,base.css 头部携带版本号,git 历史即变更日志。
适用场景主要是带有工程讲解、方案草图、白板讨论气质的 HTML 页面。限制在于它是一套约束严格的样式规范,扩展数量固定且边界明确,不提供外部依赖或额外平台能力;文中未提供收费、平台兼容性与效果数据。