經歷了 5 個 alpha 版本後，Bootstrap Icons 已於近日正式發布 v1.0.0 穩定版。目前該圖標庫已擁有超過 1100 個圖標，團隊計劃在即將發布的小版本中再為其增加數百個圖標。
自第五個 alpha 版本發布以來，團隊已經重新繪製了超過三分之一的圖標，主要是因為對路徑和形狀進行了微調。這裡的大部分重繪和改進都是為圖標字體(icon font)做準備，但遺憾的是，由於從 SVG 生成字體的工具未夠完善，所以圖標字體被推遲到了 v1.1.0 版本。
安裝
通過 npm 安裝：
npmi bootstrap-icons
或者從 GitHub 下載新版本，或僅下載 SVG 文件（不包含倉庫的其他文件）。
用法
根據自己的設置，可以通過多種方式將 Bootstrap Icons 添加到項目：
將 SVG 複製粘貼為內嵌式的 HTML 元素<svgclass="bi bi-chevron-right"width="32"height="32"viewBox="0 0 20 20"fill="currentColor"xmlns="http://www.w3.org/2000/svg"><pathfill-rule="evenodd"d="M6.646 3.646a.5.5 0 01.708 0l6 6a.5.5 0 010 .708l-6 6a.5.5 0 01-.708-.708L12.293 10 6.646 4.354a.5.5 0 010-.708z"/></svg>
通過<img>元素引用<imgsrc="/assets/img/bootstrap.svg"alt=""width="32"height="32"title="Bootstrap">
使用 SVG sprite<svgclass="bi"width="32"height="32"fill="currentColor">
<usexlink:href="bootstrap-icons.svg#heart-fill"/>
</svg>
<svgclass="bi"width="32"height="32"fill="currentColor">
<usexlink:href="bootstrap-icons.svg#toggles"/>
</svg>
<svgclass="bi"width="32"height="32"fill="currentColor">
<usexlink:href="bootstrap-icons.svg#shop"/>
</svg>
通過 CSS 引入.bi::before {
display: inline-block;
content: "";
background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z' clip-rule='evenodd'/></svg>"); background-repeat: no-repeat;
background-size: 1rem1rem;
}
詳情查看發布公告。