popcorn icon
popcorn-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- popcorn-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Use the popcorn icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M228.14 75.66a6 6 0 0 0-5.79-1.43l-1.41.4a42 42 0 0 0-54.07-30.52a42 42 0 0 0-77.74 0a42 42 0 0 0-54.07 30.52l-1.41-.4a6 6 0 0 0-7.49 7.14l30.55 129.84A14 14 0 0 0 70.34 222h115.32a14 14 0 0 0 13.63-10.79l30.55-129.84a6 6 0 0 0-1.7-5.71M76 54a29.54 29.54 0 0 1 14 3.49a6 6 0 0 0 8.68-4a30 30 0 0 1 58.56 0a6 6 0 0 0 8.67 4A29.6 29.6 0 0 1 180 54a30 30 0 0 1 29.39 23.94l-41.07 11.73l-35.12-14a14 14 0 0 0-10.4 0l-35.12 14l-41.07-11.73A30 30 0 0 1 76 54m85.44 45.84L146.75 210h-37.5L94.56 99.84l32.7-13.08a2 2 0 0 1 1.48 0Zm-93 108.62L40.18 88.58l42.39 12.11L97.15 210H70.34a2 2 0 0 1-1.95-1.54Zm119.22 0a2 2 0 0 1-2 1.54h-26.81l14.58-109.31l42.39-12.11Z"/></svg>
React
import type { SVGProps } from "react";
export function PhPopcornLight(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="M228.14 75.66a6 6 0 0 0-5.79-1.43l-1.41.4a42 42 0 0 0-54.07-30.52a42 42 0 0 0-77.74 0a42 42 0 0 0-54.07 30.52l-1.41-.4a6 6 0 0 0-7.49 7.14l30.55 129.84A14 14 0 0 0 70.34 222h115.32a14 14 0 0 0 13.63-10.79l30.55-129.84a6 6 0 0 0-1.7-5.71M76 54a29.54 29.54 0 0 1 14 3.49a6 6 0 0 0 8.68-4a30 30 0 0 1 58.56 0a6 6 0 0 0 8.67 4A29.6 29.6 0 0 1 180 54a30 30 0 0 1 29.39 23.94l-41.07 11.73l-35.12-14a14 14 0 0 0-10.4 0l-35.12 14l-41.07-11.73A30 30 0 0 1 76 54m85.44 45.84L146.75 210h-37.5L94.56 99.84l32.7-13.08a2 2 0 0 1 1.48 0Zm-93 108.62L40.18 88.58l42.39 12.11L97.15 210H70.34a2 2 0 0 1-1.95-1.54Zm119.22 0a2 2 0 0 1-2 1.54h-26.81l14.58-109.31l42.39-12.11Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M228.14 75.66a6 6 0 0 0-5.79-1.43l-1.41.4a42 42 0 0 0-54.07-30.52a42 42 0 0 0-77.74 0a42 42 0 0 0-54.07 30.52l-1.41-.4a6 6 0 0 0-7.49 7.14l30.55 129.84A14 14 0 0 0 70.34 222h115.32a14 14 0 0 0 13.63-10.79l30.55-129.84a6 6 0 0 0-1.7-5.71M76 54a29.54 29.54 0 0 1 14 3.49a6 6 0 0 0 8.68-4a30 30 0 0 1 58.56 0a6 6 0 0 0 8.67 4A29.6 29.6 0 0 1 180 54a30 30 0 0 1 29.39 23.94l-41.07 11.73l-35.12-14a14 14 0 0 0-10.4 0l-35.12 14l-41.07-11.73A30 30 0 0 1 76 54m85.44 45.84L146.75 210h-37.5L94.56 99.84l32.7-13.08a2 2 0 0 1 1.48 0Zm-93 108.62L40.18 88.58l42.39 12.11L97.15 210H70.34a2 2 0 0 1-1.95-1.54Zm119.22 0a2 2 0 0 1-2 1.54h-26.81l14.58-109.31l42.39-12.11Z"/></svg> </template>
CSS
.icon-popcorn-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%22M228.14%2075.66a6%206%200%200%200-5.79-1.43l-1.41.4a42%2042%200%200%200-54.07-30.52a42%2042%200%200%200-77.74%200a42%2042%200%200%200-54.07%2030.52l-1.41-.4a6%206%200%200%200-7.49%207.14l30.55%20129.84A14%2014%200%200%200%2070.34%20222h115.32a14%2014%200%200%200%2013.63-10.79l30.55-129.84a6%206%200%200%200-1.7-5.71M76%2054a29.54%2029.54%200%200%201%2014%203.49a6%206%200%200%200%208.68-4a30%2030%200%200%201%2058.56%200a6%206%200%200%200%208.67%204A29.6%2029.6%200%200%201%20180%2054a30%2030%200%200%201%2029.39%2023.94l-41.07%2011.73l-35.12-14a14%2014%200%200%200-10.4%200l-35.12%2014l-41.07-11.73A30%2030%200%200%201%2076%2054m85.44%2045.84L146.75%20210h-37.5L94.56%2099.84l32.7-13.08a2%202%200%200%201%201.48%200Zm-93%20108.62L40.18%2088.58l42.39%2012.11L97.15%20210H70.34a2%202%200%200%201-1.95-1.54Zm119.22%200a2%202%200%200%201-2%201.54h-26.81l14.58-109.31l42.39-12.11Z%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%22M228.14%2075.66a6%206%200%200%200-5.79-1.43l-1.41.4a42%2042%200%200%200-54.07-30.52a42%2042%200%200%200-77.74%200a42%2042%200%200%200-54.07%2030.52l-1.41-.4a6%206%200%200%200-7.49%207.14l30.55%20129.84A14%2014%200%200%200%2070.34%20222h115.32a14%2014%200%200%200%2013.63-10.79l30.55-129.84a6%206%200%200%200-1.7-5.71M76%2054a29.54%2029.54%200%200%201%2014%203.49a6%206%200%200%200%208.68-4a30%2030%200%200%201%2058.56%200a6%206%200%200%200%208.67%204A29.6%2029.6%200%200%201%20180%2054a30%2030%200%200%201%2029.39%2023.94l-41.07%2011.73l-35.12-14a14%2014%200%200%200-10.4%200l-35.12%2014l-41.07-11.73A30%2030%200%200%201%2076%2054m85.44%2045.84L146.75%20210h-37.5L94.56%2099.84l32.7-13.08a2%202%200%200%201%201.48%200Zm-93%20108.62L40.18%2088.58l42.39%2012.11L97.15%20210H70.34a2%202%200%200%201-1.95-1.54Zm119.22%200a2%202%200%200%201-2%201.54h-26.81l14.58-109.31l42.39-12.11Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/popcorn-light.svg?color=%231a73e8&size=48
