bootstrap icon
bootstrap-fill from Akar Icons by Arturo Wibawa · Fill · MIT Free for personal and commercial use.
- Name
- bootstrap-fill
- Set
- Akar Icons
- Style
- Fill
- Viewbox
- 24×24
- License
- MIT
The same icon in other sets
Use the bootstrap icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M4.985 2c-1.37 0-2.383 1.199-2.337 2.498c.043 1.25-.013 2.867-.42 4.186c-.41 1.322-1.1 2.16-2.228 2.268v1.215c1.128.107 1.819.945 2.227 2.268c.408 1.319.464 2.936.42 4.185c-.045 1.3.968 2.499 2.338 2.499h14.032c1.37 0 2.383-1.199 2.337-2.499c-.043-1.249.013-2.866.42-4.185c.409-1.323 1.098-2.16 2.226-2.268v-1.215c-1.128-.108-1.817-.946-2.226-2.268c-.407-1.32-.463-2.937-.42-4.186C21.4 3.198 20.386 2 19.017 2zM16.27 13.769c0 1.79-1.335 2.875-3.55 2.875H8.949a.407.407 0 0 1-.407-.407V6.881a.407.407 0 0 1 .407-.406h3.75c1.847 0 3.06 1 3.06 2.537c0 1.078-.816 2.043-1.855 2.213v.056c1.415.155 2.367 1.135 2.367 2.488M12.31 7.764h-2.15v3.038h1.811c1.4 0 2.172-.564 2.172-1.572c0-.944-.664-1.466-1.833-1.466m-2.15 4.243v3.347h2.23c1.457 0 2.23-.585 2.23-1.684c0-1.1-.794-1.663-2.324-1.663z" clip-rule="evenodd"/></svg>
React
import type { SVGProps } from "react";
export function AkarIconsBootstrapFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fillRule="evenodd" d="M4.985 2c-1.37 0-2.383 1.199-2.337 2.498c.043 1.25-.013 2.867-.42 4.186c-.41 1.322-1.1 2.16-2.228 2.268v1.215c1.128.107 1.819.945 2.227 2.268c.408 1.319.464 2.936.42 4.185c-.045 1.3.968 2.499 2.338 2.499h14.032c1.37 0 2.383-1.199 2.337-2.499c-.043-1.249.013-2.866.42-4.185c.409-1.323 1.098-2.16 2.226-2.268v-1.215c-1.128-.108-1.817-.946-2.226-2.268c-.407-1.32-.463-2.937-.42-4.186C21.4 3.198 20.386 2 19.017 2zM16.27 13.769c0 1.79-1.335 2.875-3.55 2.875H8.949a.407.407 0 0 1-.407-.407V6.881a.407.407 0 0 1 .407-.406h3.75c1.847 0 3.06 1 3.06 2.537c0 1.078-.816 2.043-1.855 2.213v.056c1.415.155 2.367 1.135 2.367 2.488M12.31 7.764h-2.15v3.038h1.811c1.4 0 2.172-.564 2.172-1.572c0-.944-.664-1.466-1.833-1.466m-2.15 4.243v3.347h2.23c1.457 0 2.23-.585 2.23-1.684c0-1.1-.794-1.663-2.324-1.663z" clipRule="evenodd"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M4.985 2c-1.37 0-2.383 1.199-2.337 2.498c.043 1.25-.013 2.867-.42 4.186c-.41 1.322-1.1 2.16-2.228 2.268v1.215c1.128.107 1.819.945 2.227 2.268c.408 1.319.464 2.936.42 4.185c-.045 1.3.968 2.499 2.338 2.499h14.032c1.37 0 2.383-1.199 2.337-2.499c-.043-1.249.013-2.866.42-4.185c.409-1.323 1.098-2.16 2.226-2.268v-1.215c-1.128-.108-1.817-.946-2.226-2.268c-.407-1.32-.463-2.937-.42-4.186C21.4 3.198 20.386 2 19.017 2zM16.27 13.769c0 1.79-1.335 2.875-3.55 2.875H8.949a.407.407 0 0 1-.407-.407V6.881a.407.407 0 0 1 .407-.406h3.75c1.847 0 3.06 1 3.06 2.537c0 1.078-.816 2.043-1.855 2.213v.056c1.415.155 2.367 1.135 2.367 2.488M12.31 7.764h-2.15v3.038h1.811c1.4 0 2.172-.564 2.172-1.572c0-.944-.664-1.466-1.833-1.466m-2.15 4.243v3.347h2.23c1.457 0 2.23-.585 2.23-1.684c0-1.1-.794-1.663-2.324-1.663z" clip-rule="evenodd"/></svg> </template>
CSS
.icon-bootstrap-fill {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M4.985%202c-1.37%200-2.383%201.199-2.337%202.498c.043%201.25-.013%202.867-.42%204.186c-.41%201.322-1.1%202.16-2.228%202.268v1.215c1.128.107%201.819.945%202.227%202.268c.408%201.319.464%202.936.42%204.185c-.045%201.3.968%202.499%202.338%202.499h14.032c1.37%200%202.383-1.199%202.337-2.499c-.043-1.249.013-2.866.42-4.185c.409-1.323%201.098-2.16%202.226-2.268v-1.215c-1.128-.108-1.817-.946-2.226-2.268c-.407-1.32-.463-2.937-.42-4.186C21.4%203.198%2020.386%202%2019.017%202zM16.27%2013.769c0%201.79-1.335%202.875-3.55%202.875H8.949a.407.407%200%200%201-.407-.407V6.881a.407.407%200%200%201%20.407-.406h3.75c1.847%200%203.06%201%203.06%202.537c0%201.078-.816%202.043-1.855%202.213v.056c1.415.155%202.367%201.135%202.367%202.488M12.31%207.764h-2.15v3.038h1.811c1.4%200%202.172-.564%202.172-1.572c0-.944-.664-1.466-1.833-1.466m-2.15%204.243v3.347h2.23c1.457%200%202.23-.585%202.23-1.684c0-1.1-.794-1.663-2.324-1.663z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M4.985%202c-1.37%200-2.383%201.199-2.337%202.498c.043%201.25-.013%202.867-.42%204.186c-.41%201.322-1.1%202.16-2.228%202.268v1.215c1.128.107%201.819.945%202.227%202.268c.408%201.319.464%202.936.42%204.185c-.045%201.3.968%202.499%202.338%202.499h14.032c1.37%200%202.383-1.199%202.337-2.499c-.043-1.249.013-2.866.42-4.185c.409-1.323%201.098-2.16%202.226-2.268v-1.215c-1.128-.108-1.817-.946-2.226-2.268c-.407-1.32-.463-2.937-.42-4.186C21.4%203.198%2020.386%202%2019.017%202zM16.27%2013.769c0%201.79-1.335%202.875-3.55%202.875H8.949a.407.407%200%200%201-.407-.407V6.881a.407.407%200%200%201%20.407-.406h3.75c1.847%200%203.06%201%203.06%202.537c0%201.078-.816%202.043-1.855%202.213v.056c1.415.155%202.367%201.135%202.367%202.488M12.31%207.764h-2.15v3.038h1.811c1.4%200%202.172-.564%202.172-1.572c0-.944-.664-1.466-1.833-1.466m-2.15%204.243v3.347h2.23c1.457%200%202.23-.585%202.23-1.684c0-1.1-.794-1.663-2.324-1.663z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/akar-icons/bootstrap-fill.svg?color=%231a73e8&size=48