megaphone icon
megaphone-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- megaphone-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
megaphoneBootstrap IconsmegaphoneBoxIcons v2 SolidmegaphoneCodiconsmegaphoneEmoji One (Colored)megaphone-12-filledFluent UI System IconsmegaphoneFluent EmojimegaphoneFluent Emoji FlatmegaphoneFluent Emoji High ContrastmegaphoneFirefox OS EmojimegaphoneHealth IconsmegaphoneHeroIconsmegaphoneIconoirmegaphoneIonIconsmegaphoneLucidemegaphoneMajesticonsmegaphoneNoto EmojimegaphoneOcticonsmegaphoneOpenMojimegaphonePixelarticonsmegaphonePrime Iconsmegaphone-fillRemix IconmegaphoneTwitter EmojimegaphoneUnicons
Related icons in Phosphor
Use the megaphone icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 120a46.05 46.05 0 0 0-46-46h-39.85c-2.58-.15-54.1-3.57-103.15-44.71A14 14 0 0 0 34 40v160a13.85 13.85 0 0 0 8.07 12.68A14.2 14.2 0 0 0 48 214a13.9 13.9 0 0 0 9-3.3c40-33.52 81.57-42 97-44.07v34a14 14 0 0 0 6.23 11.65l11 7.33a14 14 0 0 0 21.32-8.17l12.13-45.71A46.07 46.07 0 0 0 246 120M49.29 201.52A2 2 0 0 1 46 200V40a1.9 1.9 0 0 1 1.15-1.8A2.1 2.1 0 0 1 48 38a1.9 1.9 0 0 1 1.26.48c44 36.92 89 45.19 104.71 47v69c-15.68 1.85-60.67 10.13-104.68 47.04m131.64 7a2 2 0 0 1-3.05 1.18l-11-7.33a2 2 0 0 1-.89-1.67V166h26.2ZM200 154h-34V86h34a34 34 0 1 1 0 68"/></svg>
React
import type { SVGProps } from "react";
export function PhMegaphoneLight(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 120a46.05 46.05 0 0 0-46-46h-39.85c-2.58-.15-54.1-3.57-103.15-44.71A14 14 0 0 0 34 40v160a13.85 13.85 0 0 0 8.07 12.68A14.2 14.2 0 0 0 48 214a13.9 13.9 0 0 0 9-3.3c40-33.52 81.57-42 97-44.07v34a14 14 0 0 0 6.23 11.65l11 7.33a14 14 0 0 0 21.32-8.17l12.13-45.71A46.07 46.07 0 0 0 246 120M49.29 201.52A2 2 0 0 1 46 200V40a1.9 1.9 0 0 1 1.15-1.8A2.1 2.1 0 0 1 48 38a1.9 1.9 0 0 1 1.26.48c44 36.92 89 45.19 104.71 47v69c-15.68 1.85-60.67 10.13-104.68 47.04m131.64 7a2 2 0 0 1-3.05 1.18l-11-7.33a2 2 0 0 1-.89-1.67V166h26.2ZM200 154h-34V86h34a34 34 0 1 1 0 68"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 120a46.05 46.05 0 0 0-46-46h-39.85c-2.58-.15-54.1-3.57-103.15-44.71A14 14 0 0 0 34 40v160a13.85 13.85 0 0 0 8.07 12.68A14.2 14.2 0 0 0 48 214a13.9 13.9 0 0 0 9-3.3c40-33.52 81.57-42 97-44.07v34a14 14 0 0 0 6.23 11.65l11 7.33a14 14 0 0 0 21.32-8.17l12.13-45.71A46.07 46.07 0 0 0 246 120M49.29 201.52A2 2 0 0 1 46 200V40a1.9 1.9 0 0 1 1.15-1.8A2.1 2.1 0 0 1 48 38a1.9 1.9 0 0 1 1.26.48c44 36.92 89 45.19 104.71 47v69c-15.68 1.85-60.67 10.13-104.68 47.04m131.64 7a2 2 0 0 1-3.05 1.18l-11-7.33a2 2 0 0 1-.89-1.67V166h26.2ZM200 154h-34V86h34a34 34 0 1 1 0 68"/></svg> </template>
CSS
.icon-megaphone-light {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M246%20120a46.05%2046.05%200%200%200-46-46h-39.85c-2.58-.15-54.1-3.57-103.15-44.71A14%2014%200%200%200%2034%2040v160a13.85%2013.85%200%200%200%208.07%2012.68A14.2%2014.2%200%200%200%2048%20214a13.9%2013.9%200%200%200%209-3.3c40-33.52%2081.57-42%2097-44.07v34a14%2014%200%200%200%206.23%2011.65l11%207.33a14%2014%200%200%200%2021.32-8.17l12.13-45.71A46.07%2046.07%200%200%200%20246%20120M49.29%20201.52A2%202%200%200%201%2046%20200V40a1.9%201.9%200%200%201%201.15-1.8A2.1%202.1%200%200%201%2048%2038a1.9%201.9%200%200%201%201.26.48c44%2036.92%2089%2045.19%20104.71%2047v69c-15.68%201.85-60.67%2010.13-104.68%2047.04m131.64%207a2%202%200%200%201-3.05%201.18l-11-7.33a2%202%200%200%201-.89-1.67V166h26.2ZM200%20154h-34V86h34a34%2034%200%201%201%200%2068%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M246%20120a46.05%2046.05%200%200%200-46-46h-39.85c-2.58-.15-54.1-3.57-103.15-44.71A14%2014%200%200%200%2034%2040v160a13.85%2013.85%200%200%200%208.07%2012.68A14.2%2014.2%200%200%200%2048%20214a13.9%2013.9%200%200%200%209-3.3c40-33.52%2081.57-42%2097-44.07v34a14%2014%200%200%200%206.23%2011.65l11%207.33a14%2014%200%200%200%2021.32-8.17l12.13-45.71A46.07%2046.07%200%200%200%20246%20120M49.29%20201.52A2%202%200%200%201%2046%20200V40a1.9%201.9%200%200%201%201.15-1.8A2.1%202.1%200%200%201%2048%2038a1.9%201.9%200%200%201%201.26.48c44%2036.92%2089%2045.19%20104.71%2047v69c-15.68%201.85-60.67%2010.13-104.68%2047.04m131.64%207a2%202%200%200%201-3.05%201.18l-11-7.33a2%202%200%200%201-.89-1.67V166h26.2ZM200%20154h-34V86h34a34%2034%200%201%201%200%2068%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/megaphone-light.svg?color=%231a73e8&size=48
