太神奇了，仅使用彩色字体实现代码高亮

主要观点总结

文章介绍了通过引入特殊字体实现代码高亮的方案，无需使用复杂的语法高亮库，无需改变页面HTML结构，具有使用简单、无需JS、兼容性好等优点。

关键观点总结

关键观点1: 代码高亮的传统实现方式

通常需要通过复杂的语法高亮库，如Prism或highlight.js，这些库通过扫描代码并为关键词添加标签来改变颜色，但会导致页面臃肿。

关键观点2: 新的代码高亮方式

通过引入一个特殊字体（FontWithASyntaxHighlighter）实现代码高亮，无需额外创建标签，只需在pre标签中引入该字体即可。

关键观点3: 原理介绍

主要依赖于OpenType COLR和OpenType contextual alternates两个原理，前者是彩色字体的一种规范，后者用于匹配相邻字符并替换字形。

关键观点4: 自定义样式

通过CSS font-palette来自定义颜色，可以覆盖默认调色板中的颜色。

关键观点5: 优缺点和兼容性

使用简单、无需JS、HTML干净、兼容性好是其主要优点；但字体制作困难、颜色类型支持有限、匹配有时可能出现问题等是其缺点。需要注意Safari在17.0-17.1版本存在支持问题的bug。