emoji tear icon
emoji-tear-fill from Bootstrap Icons by The Bootstrap Authors · Fill · MIT Free for personal and commercial use.
- Name
- emoji-tear-fill
- Set
- Bootstrap Icons
- Style
- Fill
- Viewbox
- 16×16
- License
- MIT
1 other variant in Bootstrap Icons
Related icons in Bootstrap Icons
Use the emoji tear icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M9.5 3.5a.5.5 0 0 0 .5.5c.838 0 1.65.416 2.053 1.224a.5.5 0 1 0 .894-.448C12.351 3.584 11.162 3 10 3a.5.5 0 0 0-.5.5M7 6.5C7 5.672 6.552 5 6 5s-1 .672-1 1.5S5.448 8 6 8s1-.672 1-1.5M4.5 13c.828 0 1.5-.746 1.5-1.667c0-.706-.882-2.29-1.294-2.99a.238.238 0 0 0-.412 0C3.882 9.044 3 10.628 3 11.334C3 12.253 3.672 13 4.5 13M8 11.197c.916 0 1.607.408 2.25.826c.212.138.424-.069.282-.277c-.564-.83-1.558-2.049-2.532-2.049c-.53 0-1.066.361-1.536.824q.126.27.232.535q.069.174.135.373A3.1 3.1 0 0 1 8 11.197M10 8c.552 0 1-.672 1-1.5S10.552 5 10 5s-1 .672-1 1.5S9.448 8 10 8M6.5 3c-1.162 0-2.35.584-2.947 1.776a.5.5 0 1 0 .894.448C4.851 4.416 5.662 4 6.5 4a.5.5 0 0 0 0-1"/></svg>
React
import type { SVGProps } from "react";
export function BiEmojiTearFill(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="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M9.5 3.5a.5.5 0 0 0 .5.5c.838 0 1.65.416 2.053 1.224a.5.5 0 1 0 .894-.448C12.351 3.584 11.162 3 10 3a.5.5 0 0 0-.5.5M7 6.5C7 5.672 6.552 5 6 5s-1 .672-1 1.5S5.448 8 6 8s1-.672 1-1.5M4.5 13c.828 0 1.5-.746 1.5-1.667c0-.706-.882-2.29-1.294-2.99a.238.238 0 0 0-.412 0C3.882 9.044 3 10.628 3 11.334C3 12.253 3.672 13 4.5 13M8 11.197c.916 0 1.607.408 2.25.826c.212.138.424-.069.282-.277c-.564-.83-1.558-2.049-2.532-2.049c-.53 0-1.066.361-1.536.824q.126.27.232.535q.069.174.135.373A3.1 3.1 0 0 1 8 11.197M10 8c.552 0 1-.672 1-1.5S10.552 5 10 5s-1 .672-1 1.5S9.448 8 10 8M6.5 3c-1.162 0-2.35.584-2.947 1.776a.5.5 0 1 0 .894.448C4.851 4.416 5.662 4 6.5 4a.5.5 0 0 0 0-1"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M9.5 3.5a.5.5 0 0 0 .5.5c.838 0 1.65.416 2.053 1.224a.5.5 0 1 0 .894-.448C12.351 3.584 11.162 3 10 3a.5.5 0 0 0-.5.5M7 6.5C7 5.672 6.552 5 6 5s-1 .672-1 1.5S5.448 8 6 8s1-.672 1-1.5M4.5 13c.828 0 1.5-.746 1.5-1.667c0-.706-.882-2.29-1.294-2.99a.238.238 0 0 0-.412 0C3.882 9.044 3 10.628 3 11.334C3 12.253 3.672 13 4.5 13M8 11.197c.916 0 1.607.408 2.25.826c.212.138.424-.069.282-.277c-.564-.83-1.558-2.049-2.532-2.049c-.53 0-1.066.361-1.536.824q.126.27.232.535q.069.174.135.373A3.1 3.1 0 0 1 8 11.197M10 8c.552 0 1-.672 1-1.5S10.552 5 10 5s-1 .672-1 1.5S9.448 8 10 8M6.5 3c-1.162 0-2.35.584-2.947 1.776a.5.5 0 1 0 .894.448C4.851 4.416 5.662 4 6.5 4a.5.5 0 0 0 0-1"/></svg> </template>
CSS
.icon-emoji-tear-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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M16%208A8%208%200%201%201%200%208a8%208%200%200%201%2016%200M9.5%203.5a.5.5%200%200%200%20.5.5c.838%200%201.65.416%202.053%201.224a.5.5%200%201%200%20.894-.448C12.351%203.584%2011.162%203%2010%203a.5.5%200%200%200-.5.5M7%206.5C7%205.672%206.552%205%206%205s-1%20.672-1%201.5S5.448%208%206%208s1-.672%201-1.5M4.5%2013c.828%200%201.5-.746%201.5-1.667c0-.706-.882-2.29-1.294-2.99a.238.238%200%200%200-.412%200C3.882%209.044%203%2010.628%203%2011.334C3%2012.253%203.672%2013%204.5%2013M8%2011.197c.916%200%201.607.408%202.25.826c.212.138.424-.069.282-.277c-.564-.83-1.558-2.049-2.532-2.049c-.53%200-1.066.361-1.536.824q.126.27.232.535q.069.174.135.373A3.1%203.1%200%200%201%208%2011.197M10%208c.552%200%201-.672%201-1.5S10.552%205%2010%205s-1%20.672-1%201.5S9.448%208%2010%208M6.5%203c-1.162%200-2.35.584-2.947%201.776a.5.5%200%201%200%20.894.448C4.851%204.416%205.662%204%206.5%204a.5.5%200%200%200%200-1%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%22M16%208A8%208%200%201%201%200%208a8%208%200%200%201%2016%200M9.5%203.5a.5.5%200%200%200%20.5.5c.838%200%201.65.416%202.053%201.224a.5.5%200%201%200%20.894-.448C12.351%203.584%2011.162%203%2010%203a.5.5%200%200%200-.5.5M7%206.5C7%205.672%206.552%205%206%205s-1%20.672-1%201.5S5.448%208%206%208s1-.672%201-1.5M4.5%2013c.828%200%201.5-.746%201.5-1.667c0-.706-.882-2.29-1.294-2.99a.238.238%200%200%200-.412%200C3.882%209.044%203%2010.628%203%2011.334C3%2012.253%203.672%2013%204.5%2013M8%2011.197c.916%200%201.607.408%202.25.826c.212.138.424-.069.282-.277c-.564-.83-1.558-2.049-2.532-2.049c-.53%200-1.066.361-1.536.824q.126.27.232.535q.069.174.135.373A3.1%203.1%200%200%201%208%2011.197M10%208c.552%200%201-.672%201-1.5S10.552%205%2010%205s-1%20.672-1%201.5S9.448%208%2010%208M6.5%203c-1.162%200-2.35.584-2.947%201.776a.5.5%200%201%200%20.894.448C4.851%204.416%205.662%204%206.5%204a.5.5%200%200%200%200-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bi/emoji-tear-fill.svg?color=%231a73e8&size=48
