line icon
line from Bootstrap Icons by The Bootstrap Authors · Outline · MIT Free for personal and commercial use.
- Name
- line
- Set
- Bootstrap Icons
- Style
- Outline
- Viewbox
- 16×16
- License
- MIT
The same icon in other sets
line-outlinedAnt Design IconslineCoreUI BrandslineFont Awesome 6 BrandslineFont Awesome Brandsline-20-filledFluent UI System IconslineHuge IconslineJam IconslineLine AwesomelineMage Iconsline-fillMingCute Iconline-fillRemix IconlineSimple IconslineTabler Iconsline-outlineTeenyiconslineUniconslineUnicons Monochrome
Use the line icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 0c4.411 0 8 2.912 8 6.492c0 1.433-.555 2.723-1.715 3.994c-1.678 1.932-5.431 4.285-6.285 4.645c-.83.35-.734-.197-.696-.413l.003-.018l.114-.685c.027-.204.055-.521-.026-.723c-.09-.223-.444-.339-.704-.395C2.846 12.39 0 9.701 0 6.492C0 2.912 3.59 0 8 0M5.022 7.686H3.497V4.918a.156.156 0 0 0-.155-.156H2.78a.156.156 0 0 0-.156.156v3.486c0 .041.017.08.044.107v.001l.002.002l.002.002a.15.15 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157m.791-2.924a.156.156 0 0 0-.156.156v3.486c0 .086.07.155.156.155h.562c.086 0 .155-.07.155-.155V4.918a.156.156 0 0 0-.155-.156zm3.863 0a.156.156 0 0 0-.156.156v2.07L7.923 4.832l-.013-.015v-.001l-.01-.01l-.003-.003l-.011-.009h-.001L7.88 4.79l-.003-.002l-.005-.003l-.008-.005h-.002l-.003-.002l-.01-.004l-.004-.002l-.01-.003h-.002l-.003-.001l-.009-.002h-.006l-.003-.001h-.004l-.002-.001h-.574a.156.156 0 0 0-.156.155v3.486c0 .086.07.155.156.155h.56c.087 0 .157-.07.157-.155v-2.07l1.6 2.16a.2.2 0 0 0 .039.038l.001.001l.01.006l.004.002l.008.004l.007.003l.005.002l.01.003h.003a.2.2 0 0 0 .04.006h.56c.087 0 .157-.07.157-.155V4.918a.156.156 0 0 0-.156-.156zm3.815.717v-.56a.156.156 0 0 0-.155-.157h-2.242a.16.16 0 0 0-.108.044h-.001l-.001.002l-.002.003a.16.16 0 0 0-.044.107v3.486c0 .041.017.08.044.107l.002.003l.002.002a.16.16 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156Z"/></svg>
React
import type { SVGProps } from "react";
export function BiLine(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 0c4.411 0 8 2.912 8 6.492c0 1.433-.555 2.723-1.715 3.994c-1.678 1.932-5.431 4.285-6.285 4.645c-.83.35-.734-.197-.696-.413l.003-.018l.114-.685c.027-.204.055-.521-.026-.723c-.09-.223-.444-.339-.704-.395C2.846 12.39 0 9.701 0 6.492C0 2.912 3.59 0 8 0M5.022 7.686H3.497V4.918a.156.156 0 0 0-.155-.156H2.78a.156.156 0 0 0-.156.156v3.486c0 .041.017.08.044.107v.001l.002.002l.002.002a.15.15 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157m.791-2.924a.156.156 0 0 0-.156.156v3.486c0 .086.07.155.156.155h.562c.086 0 .155-.07.155-.155V4.918a.156.156 0 0 0-.155-.156zm3.863 0a.156.156 0 0 0-.156.156v2.07L7.923 4.832l-.013-.015v-.001l-.01-.01l-.003-.003l-.011-.009h-.001L7.88 4.79l-.003-.002l-.005-.003l-.008-.005h-.002l-.003-.002l-.01-.004l-.004-.002l-.01-.003h-.002l-.003-.001l-.009-.002h-.006l-.003-.001h-.004l-.002-.001h-.574a.156.156 0 0 0-.156.155v3.486c0 .086.07.155.156.155h.56c.087 0 .157-.07.157-.155v-2.07l1.6 2.16a.2.2 0 0 0 .039.038l.001.001l.01.006l.004.002l.008.004l.007.003l.005.002l.01.003h.003a.2.2 0 0 0 .04.006h.56c.087 0 .157-.07.157-.155V4.918a.156.156 0 0 0-.156-.156zm3.815.717v-.56a.156.156 0 0 0-.155-.157h-2.242a.16.16 0 0 0-.108.044h-.001l-.001.002l-.002.003a.16.16 0 0 0-.044.107v3.486c0 .041.017.08.044.107l.002.003l.002.002a.16.16 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 0c4.411 0 8 2.912 8 6.492c0 1.433-.555 2.723-1.715 3.994c-1.678 1.932-5.431 4.285-6.285 4.645c-.83.35-.734-.197-.696-.413l.003-.018l.114-.685c.027-.204.055-.521-.026-.723c-.09-.223-.444-.339-.704-.395C2.846 12.39 0 9.701 0 6.492C0 2.912 3.59 0 8 0M5.022 7.686H3.497V4.918a.156.156 0 0 0-.155-.156H2.78a.156.156 0 0 0-.156.156v3.486c0 .041.017.08.044.107v.001l.002.002l.002.002a.15.15 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157m.791-2.924a.156.156 0 0 0-.156.156v3.486c0 .086.07.155.156.155h.562c.086 0 .155-.07.155-.155V4.918a.156.156 0 0 0-.155-.156zm3.863 0a.156.156 0 0 0-.156.156v2.07L7.923 4.832l-.013-.015v-.001l-.01-.01l-.003-.003l-.011-.009h-.001L7.88 4.79l-.003-.002l-.005-.003l-.008-.005h-.002l-.003-.002l-.01-.004l-.004-.002l-.01-.003h-.002l-.003-.001l-.009-.002h-.006l-.003-.001h-.004l-.002-.001h-.574a.156.156 0 0 0-.156.155v3.486c0 .086.07.155.156.155h.56c.087 0 .157-.07.157-.155v-2.07l1.6 2.16a.2.2 0 0 0 .039.038l.001.001l.01.006l.004.002l.008.004l.007.003l.005.002l.01.003h.003a.2.2 0 0 0 .04.006h.56c.087 0 .157-.07.157-.155V4.918a.156.156 0 0 0-.156-.156zm3.815.717v-.56a.156.156 0 0 0-.155-.157h-2.242a.16.16 0 0 0-.108.044h-.001l-.001.002l-.002.003a.16.16 0 0 0-.044.107v3.486c0 .041.017.08.044.107l.002.003l.002.002a.16.16 0 0 0 .108.043h2.242c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156v-.56a.156.156 0 0 0-.155-.157H11.81v-.589h1.525c.086 0 .155-.07.155-.156Z"/></svg> </template>
CSS
.icon-line {
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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%200c4.411%200%208%202.912%208%206.492c0%201.433-.555%202.723-1.715%203.994c-1.678%201.932-5.431%204.285-6.285%204.645c-.83.35-.734-.197-.696-.413l.003-.018l.114-.685c.027-.204.055-.521-.026-.723c-.09-.223-.444-.339-.704-.395C2.846%2012.39%200%209.701%200%206.492C0%202.912%203.59%200%208%200M5.022%207.686H3.497V4.918a.156.156%200%200%200-.155-.156H2.78a.156.156%200%200%200-.156.156v3.486c0%20.041.017.08.044.107v.001l.002.002l.002.002a.15.15%200%200%200%20.108.043h2.242c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157m.791-2.924a.156.156%200%200%200-.156.156v3.486c0%20.086.07.155.156.155h.562c.086%200%20.155-.07.155-.155V4.918a.156.156%200%200%200-.155-.156zm3.863%200a.156.156%200%200%200-.156.156v2.07L7.923%204.832l-.013-.015v-.001l-.01-.01l-.003-.003l-.011-.009h-.001L7.88%204.79l-.003-.002l-.005-.003l-.008-.005h-.002l-.003-.002l-.01-.004l-.004-.002l-.01-.003h-.002l-.003-.001l-.009-.002h-.006l-.003-.001h-.004l-.002-.001h-.574a.156.156%200%200%200-.156.155v3.486c0%20.086.07.155.156.155h.56c.087%200%20.157-.07.157-.155v-2.07l1.6%202.16a.2.2%200%200%200%20.039.038l.001.001l.01.006l.004.002l.008.004l.007.003l.005.002l.01.003h.003a.2.2%200%200%200%20.04.006h.56c.087%200%20.157-.07.157-.155V4.918a.156.156%200%200%200-.156-.156zm3.815.717v-.56a.156.156%200%200%200-.155-.157h-2.242a.16.16%200%200%200-.108.044h-.001l-.001.002l-.002.003a.16.16%200%200%200-.044.107v3.486c0%20.041.017.08.044.107l.002.003l.002.002a.16.16%200%200%200%20.108.043h2.242c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157H11.81v-.589h1.525c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157H11.81v-.589h1.525c.086%200%20.155-.07.155-.156Z%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%200c4.411%200%208%202.912%208%206.492c0%201.433-.555%202.723-1.715%203.994c-1.678%201.932-5.431%204.285-6.285%204.645c-.83.35-.734-.197-.696-.413l.003-.018l.114-.685c.027-.204.055-.521-.026-.723c-.09-.223-.444-.339-.704-.395C2.846%2012.39%200%209.701%200%206.492C0%202.912%203.59%200%208%200M5.022%207.686H3.497V4.918a.156.156%200%200%200-.155-.156H2.78a.156.156%200%200%200-.156.156v3.486c0%20.041.017.08.044.107v.001l.002.002l.002.002a.15.15%200%200%200%20.108.043h2.242c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157m.791-2.924a.156.156%200%200%200-.156.156v3.486c0%20.086.07.155.156.155h.562c.086%200%20.155-.07.155-.155V4.918a.156.156%200%200%200-.155-.156zm3.863%200a.156.156%200%200%200-.156.156v2.07L7.923%204.832l-.013-.015v-.001l-.01-.01l-.003-.003l-.011-.009h-.001L7.88%204.79l-.003-.002l-.005-.003l-.008-.005h-.002l-.003-.002l-.01-.004l-.004-.002l-.01-.003h-.002l-.003-.001l-.009-.002h-.006l-.003-.001h-.004l-.002-.001h-.574a.156.156%200%200%200-.156.155v3.486c0%20.086.07.155.156.155h.56c.087%200%20.157-.07.157-.155v-2.07l1.6%202.16a.2.2%200%200%200%20.039.038l.001.001l.01.006l.004.002l.008.004l.007.003l.005.002l.01.003h.003a.2.2%200%200%200%20.04.006h.56c.087%200%20.157-.07.157-.155V4.918a.156.156%200%200%200-.156-.156zm3.815.717v-.56a.156.156%200%200%200-.155-.157h-2.242a.16.16%200%200%200-.108.044h-.001l-.001.002l-.002.003a.16.16%200%200%200-.044.107v3.486c0%20.041.017.08.044.107l.002.003l.002.002a.16.16%200%200%200%20.108.043h2.242c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157H11.81v-.589h1.525c.086%200%20.155-.07.155-.156v-.56a.156.156%200%200%200-.155-.157H11.81v-.589h1.525c.086%200%20.155-.07.155-.156Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bi/line.svg?color=%231a73e8&size=48
