frame bug icon
frame-bug from Material Symbols Light by Google · Regular · UI Actions · Apache-2.0 Free for personal and commercial use.
- Name
- frame-bug
- Set
- Material Symbols Light
- Style
- Regular
- Category
- UI Actions
- Viewbox
- 24×24
- License
- Apache 2.0
5 other variants in Material Symbols Light
The same icon in other sets
More ui actions icons from Material Symbols Light
Use the frame bug icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M10.308 15.5h3.384v-1h-3.384zm0-4h3.384v-1h-3.384zM12 20q-1.356 0-2.493-.666q-1.138-.665-1.822-1.834H5v-1h2.254q-.229-.73-.241-1.49Q7 14.25 7 13.5H5v-1h2q0-.77-.007-1.529q-.007-.76.26-1.471H5v-1h2.685q.369-.652.912-1.161q.544-.51 1.234-.828L8.039 4.709l.669-.67l2.111 2.112q.585-.167 1.175-.167t1.175.167l2.162-2.111l.669.669l-1.804 1.803q.69.318 1.22.824q.53.507.9 1.165H19v1h-2.254q.268.712.26 1.471Q17 11.731 17 12.5h2v1h-2q0 .75-.012 1.51t-.242 1.49H19v1h-2.684q-.685 1.17-1.823 1.835T12 20M2 6V3.616q0-.691.463-1.153T3.616 2H6v1H3.616q-.232 0-.424.192T3 3.616V6zm4 16H3.616q-.691 0-1.153-.462T2 20.385V18h1v2.385q0 .23.192.423t.423.192H6zm12 0v-1h2.385q.23 0 .423-.192t.192-.424V18h1v2.385q0 .69-.462 1.152T20.385 22zm3-16V3.616q0-.232-.192-.424T20.385 3H18V2h2.385q.69 0 1.152.463T22 3.616V6z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLightFrameBug(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" d="M10.308 15.5h3.384v-1h-3.384zm0-4h3.384v-1h-3.384zM12 20q-1.356 0-2.493-.666q-1.138-.665-1.822-1.834H5v-1h2.254q-.229-.73-.241-1.49Q7 14.25 7 13.5H5v-1h2q0-.77-.007-1.529q-.007-.76.26-1.471H5v-1h2.685q.369-.652.912-1.161q.544-.51 1.234-.828L8.039 4.709l.669-.67l2.111 2.112q.585-.167 1.175-.167t1.175.167l2.162-2.111l.669.669l-1.804 1.803q.69.318 1.22.824q.53.507.9 1.165H19v1h-2.254q.268.712.26 1.471Q17 11.731 17 12.5h2v1h-2q0 .75-.012 1.51t-.242 1.49H19v1h-2.684q-.685 1.17-1.823 1.835T12 20M2 6V3.616q0-.691.463-1.153T3.616 2H6v1H3.616q-.232 0-.424.192T3 3.616V6zm4 16H3.616q-.691 0-1.153-.462T2 20.385V18h1v2.385q0 .23.192.423t.423.192H6zm12 0v-1h2.385q.23 0 .423-.192t.192-.424V18h1v2.385q0 .69-.462 1.152T20.385 22zm3-16V3.616q0-.232-.192-.424T20.385 3H18V2h2.385q.69 0 1.152.463T22 3.616V6z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M10.308 15.5h3.384v-1h-3.384zm0-4h3.384v-1h-3.384zM12 20q-1.356 0-2.493-.666q-1.138-.665-1.822-1.834H5v-1h2.254q-.229-.73-.241-1.49Q7 14.25 7 13.5H5v-1h2q0-.77-.007-1.529q-.007-.76.26-1.471H5v-1h2.685q.369-.652.912-1.161q.544-.51 1.234-.828L8.039 4.709l.669-.67l2.111 2.112q.585-.167 1.175-.167t1.175.167l2.162-2.111l.669.669l-1.804 1.803q.69.318 1.22.824q.53.507.9 1.165H19v1h-2.254q.268.712.26 1.471Q17 11.731 17 12.5h2v1h-2q0 .75-.012 1.51t-.242 1.49H19v1h-2.684q-.685 1.17-1.823 1.835T12 20M2 6V3.616q0-.691.463-1.153T3.616 2H6v1H3.616q-.232 0-.424.192T3 3.616V6zm4 16H3.616q-.691 0-1.153-.462T2 20.385V18h1v2.385q0 .23.192.423t.423.192H6zm12 0v-1h2.385q.23 0 .423-.192t.192-.424V18h1v2.385q0 .69-.462 1.152T20.385 22zm3-16V3.616q0-.232-.192-.424T20.385 3H18V2h2.385q.69 0 1.152.463T22 3.616V6z"/></svg> </template>
CSS
.icon-frame-bug {
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%20d%3D%22M10.308%2015.5h3.384v-1h-3.384zm0-4h3.384v-1h-3.384zM12%2020q-1.356%200-2.493-.666q-1.138-.665-1.822-1.834H5v-1h2.254q-.229-.73-.241-1.49Q7%2014.25%207%2013.5H5v-1h2q0-.77-.007-1.529q-.007-.76.26-1.471H5v-1h2.685q.369-.652.912-1.161q.544-.51%201.234-.828L8.039%204.709l.669-.67l2.111%202.112q.585-.167%201.175-.167t1.175.167l2.162-2.111l.669.669l-1.804%201.803q.69.318%201.22.824q.53.507.9%201.165H19v1h-2.254q.268.712.26%201.471Q17%2011.731%2017%2012.5h2v1h-2q0%20.75-.012%201.51t-.242%201.49H19v1h-2.684q-.685%201.17-1.823%201.835T12%2020M2%206V3.616q0-.691.463-1.153T3.616%202H6v1H3.616q-.232%200-.424.192T3%203.616V6zm4%2016H3.616q-.691%200-1.153-.462T2%2020.385V18h1v2.385q0%20.23.192.423t.423.192H6zm12%200v-1h2.385q.23%200%20.423-.192t.192-.424V18h1v2.385q0%20.69-.462%201.152T20.385%2022zm3-16V3.616q0-.232-.192-.424T20.385%203H18V2h2.385q.69%200%201.152.463T22%203.616V6z%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%20d%3D%22M10.308%2015.5h3.384v-1h-3.384zm0-4h3.384v-1h-3.384zM12%2020q-1.356%200-2.493-.666q-1.138-.665-1.822-1.834H5v-1h2.254q-.229-.73-.241-1.49Q7%2014.25%207%2013.5H5v-1h2q0-.77-.007-1.529q-.007-.76.26-1.471H5v-1h2.685q.369-.652.912-1.161q.544-.51%201.234-.828L8.039%204.709l.669-.67l2.111%202.112q.585-.167%201.175-.167t1.175.167l2.162-2.111l.669.669l-1.804%201.803q.69.318%201.22.824q.53.507.9%201.165H19v1h-2.254q.268.712.26%201.471Q17%2011.731%2017%2012.5h2v1h-2q0%20.75-.012%201.51t-.242%201.49H19v1h-2.684q-.685%201.17-1.823%201.835T12%2020M2%206V3.616q0-.691.463-1.153T3.616%202H6v1H3.616q-.232%200-.424.192T3%203.616V6zm4%2016H3.616q-.691%200-1.153-.462T2%2020.385V18h1v2.385q0%20.23.192.423t.423.192H6zm12%200v-1h2.385q.23%200%20.423-.192t.192-.424V18h1v2.385q0%20.69-.462%201.152T20.385%2022zm3-16V3.616q0-.232-.192-.424T20.385%203H18V2h2.385q.69%200%201.152.463T22%203.616V6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/frame-bug.svg?color=%231a73e8&size=48
