quote bubble icon
quote-bubble from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- quote-bubble
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
1 other variant in Framework7 Icons
Use the quote bubble icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M16.586 52.246c1.172 0 1.969-.61 3.375-1.875l8.11-7.195h15.023c6.984 0 10.734-3.867 10.734-10.735V14.488c0-6.867-3.75-10.734-10.734-10.734H12.906c-6.96 0-10.734 3.844-10.734 10.734v17.953c0 6.891 3.773 10.735 10.734 10.735h1.125v6.093c0 1.805.938 2.977 2.555 2.977m.96-4.289V41.16c0-1.265-.468-1.758-1.757-1.758h-2.86c-4.757 0-6.984-2.414-6.984-6.984v-17.93c0-4.57 2.227-6.96 6.985-6.96h30.164c4.734 0 6.96 2.39 6.96 6.96v17.93c0 4.57-2.226 6.984-6.96 6.984H27.906c-1.289 0-1.968.188-2.86 1.102Zm-.304-25.594c0 2.578 1.594 4.57 4.172 4.57c.938 0 1.875-.163 2.461-.89h.188c-.844 1.852-2.555 3.047-4.032 3.422c-.843.234-1.101.61-1.101 1.148c0 .586.468 1.032 1.125 1.032c2.297 0 6.867-2.72 6.867-8.438c0-3.07-1.992-5.437-4.922-5.437c-2.719 0-4.758 1.898-4.758 4.593m12.188 0c0 2.578 1.593 4.57 4.172 4.57c.937 0 1.875-.163 2.46-.89h.188c-.844 1.852-2.555 3.047-4.031 3.422c-.844.234-1.102.61-1.102 1.148c0 .586.469 1.032 1.125 1.032c2.297 0 6.89-2.72 6.89-8.438c0-3.07-2.015-5.437-4.944-5.437c-2.72 0-4.758 1.898-4.758 4.593"/></svg>
React
import type { SVGProps } from "react";
export function F7QuoteBubble(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M16.586 52.246c1.172 0 1.969-.61 3.375-1.875l8.11-7.195h15.023c6.984 0 10.734-3.867 10.734-10.735V14.488c0-6.867-3.75-10.734-10.734-10.734H12.906c-6.96 0-10.734 3.844-10.734 10.734v17.953c0 6.891 3.773 10.735 10.734 10.735h1.125v6.093c0 1.805.938 2.977 2.555 2.977m.96-4.289V41.16c0-1.265-.468-1.758-1.757-1.758h-2.86c-4.757 0-6.984-2.414-6.984-6.984v-17.93c0-4.57 2.227-6.96 6.985-6.96h30.164c4.734 0 6.96 2.39 6.96 6.96v17.93c0 4.57-2.226 6.984-6.96 6.984H27.906c-1.289 0-1.968.188-2.86 1.102Zm-.304-25.594c0 2.578 1.594 4.57 4.172 4.57c.938 0 1.875-.163 2.461-.89h.188c-.844 1.852-2.555 3.047-4.032 3.422c-.843.234-1.101.61-1.101 1.148c0 .586.468 1.032 1.125 1.032c2.297 0 6.867-2.72 6.867-8.438c0-3.07-1.992-5.437-4.922-5.437c-2.719 0-4.758 1.898-4.758 4.593m12.188 0c0 2.578 1.593 4.57 4.172 4.57c.937 0 1.875-.163 2.46-.89h.188c-.844 1.852-2.555 3.047-4.031 3.422c-.844.234-1.102.61-1.102 1.148c0 .586.469 1.032 1.125 1.032c2.297 0 6.89-2.72 6.89-8.438c0-3.07-2.015-5.437-4.944-5.437c-2.72 0-4.758 1.898-4.758 4.593"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M16.586 52.246c1.172 0 1.969-.61 3.375-1.875l8.11-7.195h15.023c6.984 0 10.734-3.867 10.734-10.735V14.488c0-6.867-3.75-10.734-10.734-10.734H12.906c-6.96 0-10.734 3.844-10.734 10.734v17.953c0 6.891 3.773 10.735 10.734 10.735h1.125v6.093c0 1.805.938 2.977 2.555 2.977m.96-4.289V41.16c0-1.265-.468-1.758-1.757-1.758h-2.86c-4.757 0-6.984-2.414-6.984-6.984v-17.93c0-4.57 2.227-6.96 6.985-6.96h30.164c4.734 0 6.96 2.39 6.96 6.96v17.93c0 4.57-2.226 6.984-6.96 6.984H27.906c-1.289 0-1.968.188-2.86 1.102Zm-.304-25.594c0 2.578 1.594 4.57 4.172 4.57c.938 0 1.875-.163 2.461-.89h.188c-.844 1.852-2.555 3.047-4.032 3.422c-.843.234-1.101.61-1.101 1.148c0 .586.468 1.032 1.125 1.032c2.297 0 6.867-2.72 6.867-8.438c0-3.07-1.992-5.437-4.922-5.437c-2.719 0-4.758 1.898-4.758 4.593m12.188 0c0 2.578 1.593 4.57 4.172 4.57c.937 0 1.875-.163 2.46-.89h.188c-.844 1.852-2.555 3.047-4.031 3.422c-.844.234-1.102.61-1.102 1.148c0 .586.469 1.032 1.125 1.032c2.297 0 6.89-2.72 6.89-8.438c0-3.07-2.015-5.437-4.944-5.437c-2.72 0-4.758 1.898-4.758 4.593"/></svg> </template>
CSS
.icon-quote-bubble {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M16.586%2052.246c1.172%200%201.969-.61%203.375-1.875l8.11-7.195h15.023c6.984%200%2010.734-3.867%2010.734-10.735V14.488c0-6.867-3.75-10.734-10.734-10.734H12.906c-6.96%200-10.734%203.844-10.734%2010.734v17.953c0%206.891%203.773%2010.735%2010.734%2010.735h1.125v6.093c0%201.805.938%202.977%202.555%202.977m.96-4.289V41.16c0-1.265-.468-1.758-1.757-1.758h-2.86c-4.757%200-6.984-2.414-6.984-6.984v-17.93c0-4.57%202.227-6.96%206.985-6.96h30.164c4.734%200%206.96%202.39%206.96%206.96v17.93c0%204.57-2.226%206.984-6.96%206.984H27.906c-1.289%200-1.968.188-2.86%201.102Zm-.304-25.594c0%202.578%201.594%204.57%204.172%204.57c.938%200%201.875-.163%202.461-.89h.188c-.844%201.852-2.555%203.047-4.032%203.422c-.843.234-1.101.61-1.101%201.148c0%20.586.468%201.032%201.125%201.032c2.297%200%206.867-2.72%206.867-8.438c0-3.07-1.992-5.437-4.922-5.437c-2.719%200-4.758%201.898-4.758%204.593m12.188%200c0%202.578%201.593%204.57%204.172%204.57c.937%200%201.875-.163%202.46-.89h.188c-.844%201.852-2.555%203.047-4.031%203.422c-.844.234-1.102.61-1.102%201.148c0%20.586.469%201.032%201.125%201.032c2.297%200%206.89-2.72%206.89-8.438c0-3.07-2.015-5.437-4.944-5.437c-2.72%200-4.758%201.898-4.758%204.593%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M16.586%2052.246c1.172%200%201.969-.61%203.375-1.875l8.11-7.195h15.023c6.984%200%2010.734-3.867%2010.734-10.735V14.488c0-6.867-3.75-10.734-10.734-10.734H12.906c-6.96%200-10.734%203.844-10.734%2010.734v17.953c0%206.891%203.773%2010.735%2010.734%2010.735h1.125v6.093c0%201.805.938%202.977%202.555%202.977m.96-4.289V41.16c0-1.265-.468-1.758-1.757-1.758h-2.86c-4.757%200-6.984-2.414-6.984-6.984v-17.93c0-4.57%202.227-6.96%206.985-6.96h30.164c4.734%200%206.96%202.39%206.96%206.96v17.93c0%204.57-2.226%206.984-6.96%206.984H27.906c-1.289%200-1.968.188-2.86%201.102Zm-.304-25.594c0%202.578%201.594%204.57%204.172%204.57c.938%200%201.875-.163%202.461-.89h.188c-.844%201.852-2.555%203.047-4.032%203.422c-.843.234-1.101.61-1.101%201.148c0%20.586.468%201.032%201.125%201.032c2.297%200%206.867-2.72%206.867-8.438c0-3.07-1.992-5.437-4.922-5.437c-2.719%200-4.758%201.898-4.758%204.593m12.188%200c0%202.578%201.593%204.57%204.172%204.57c.937%200%201.875-.163%202.46-.89h.188c-.844%201.852-2.555%203.047-4.031%203.422c-.844.234-1.102.61-1.102%201.148c0%20.586.469%201.032%201.125%201.032c2.297%200%206.89-2.72%206.89-8.438c0-3.07-2.015-5.437-4.944-5.437c-2.72%200-4.758%201.898-4.758%204.593%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/quote-bubble.svg?color=%231a73e8&size=48
