bookmark.style v0.3.0 发布，支持一键拷贝 SVG 图像到 GitHub README.md 功能

五个月前发布了一款自用小工具 https://bookmark.style ，获得的反响效果不错，有很多 V 友支持，仓库迄今为止获得 170+ star ，感谢大家支持。

十一假期，迎来了一次更新，发布了 v0.3.0 版本

bookmark.style

bookmark.style 适用于创意工作者，它可以美化你的链接，展示丰富的信息。

输入链接: https:bookmark.style

展示内容如下：

让冰冷的链接看着不再单调，更多细节参见 《 bookmark.style: 你的链接有了新的样式》

提供渲染 SVG 服务

这次更新只有一个功能添加，可以一键拷贝可视化 Web Bookmark 到你的 README.md 中，其实这是一个渲染 SVG 服务（ Serve SVG as a Service ），idea 源于社区童鞋的一个 issue

简单点说就是输入一个链接得到一个渲染好的 SVG 图像。

输入

https://svg.bookmark.style/api?url=https://bookmark.style&mode=light

生成

拷贝到 README.md

在 GitHub 中的 README.md 是可以渲染 SVG 的，所以你可以把它作为一种展示手法放在 README.md 中，加强对链接的展现。

代码

拷贝如下代码到你的 README.md 中，即可展示一个渲染好的可视化 Web Bookmark

[![bookmark.style]( https://svg.bookmark.style/api?url=https://bookmark.style&mode=light)]( https://bookmark.style)

支持 light/dark 模式

API

https://svg.bookmark.style/api?url=<URL>&mode=<light|dark>)

范例

https://svg.bookmark.style/api?url=https://bookmark.style&mode=light

支持自定义渐变颜色

URL 中的十六进制颜色不能包含 # 字符，所以你可以像这样写 #000000 -> 000000

Types

type GradidentColor = {
  formColor: string
  viaColor?: string
  toColor: string
}

API

https://svg.bookmark.style/api?url=<URL>&fromColor=<FROM_COLOR>&viaColor=<VIA_COLOR>&toColor=<TO_COLOR>)

范例

# without viaColor
https://svg.bookmark.style/api?url=https://bookmark.style&fromColor=f4a&toColor=4fa
# or with viaColor
https://svg.bookmark.style/api?url=https://bookmark.style&fromColor=f4a&viaColor=a4f&toColor=4fa

支持两种展示风格 Twitter/Notion

定义了 style 参数，vertical 代表 Twitter Like ，horizontal 代表 Notion Like

API

https://svg.bookmark.style/api?url=<URL>&style=<vertical|horizontal>)

范例

https://svg.bookmark.style/api?url=https://bookmark.style&style=vertical

参考

• bookmark.style
• xiaoluoboding/bookmark.style
• xiaoluoboding/metafy-svg