图标
docmd 内置支持 Lucide 图标库。图标可用于您的导航侧边栏、按钮和自定义组件中,以提供视觉提示并提高可扫描性。
导航图标
在 docmd.config.json 中为任何导航项分配图标。使用 Lucide 网站上找到的任何图标的 kebab-case 名称。
docmd.config.json
{
"navigation": [
{ "title": "Home", "path": "/", "icon": "home" },
{ "title": "Setup", "path": "/setup", "icon": "settings" }
]
}
容器中的图标
您也可以在按钮、标签、标签页和其他容器中使用图标,通过包含原始 HTML 或在 docmd 中跨容器使用标准的 icon: 前缀。
::: button "Download" /download icon:download
CSS 样式
所有图标都作为内联 SVG 渲染,并带有 .lucide-icon 类。您可以在 customCss 中全局更改它们的大小或描边粗细:
.lucide-icon {
stroke-width: 1.5px; /* 更细的图标,呈现现代感 */
width: 1.2rem;
height: 1.2rem;
}
/* 针对特定图标 */
.icon-rocket {
color: #ff5733;
}
图标参考
我们支持整个 Lucide 库。您可以在这里浏览数千个可用图标:
浏览 Lucide 图标