mask happy icon
mask-happy-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- mask-happy-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Related icons in Phosphor
Use the mask happy icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M188.47 124a6 6 0 1 1-8.94 8c-3.06-3.42-9.74-6-15.53-6s-12.47 2.58-15.53 6a6 6 0 0 1-8.94-8c5.35-6 15.19-10 24.47-10s19.12 4 24.47 10m-80.94 8a6 6 0 1 0 8.94-8c-5.35-6-15.19-10-24.47-10s-19.12 4-24.47 10a6 6 0 1 0 8.94 8c3.06-3.42 9.74-6 15.53-6s12.47 2.58 15.53 6m58.73 31.43a6 6 0 0 0-8.46.67a38.89 38.89 0 0 1-59.6 0a6 6 0 1 0-9.13 7.79a50.9 50.9 0 0 0 77.86 0a6 6 0 0 0-.67-8.46M222 48v55.77c0 35.45-9.53 68.86-26.83 94.06C177.4 223.74 153.54 238 128 238s-49.4-14.26-67.17-40.16C43.53 172.64 34 139.23 34 103.78V48a14 14 0 0 1 19.06-13c14.19 5.46 42.8 14.7 74.94 14.7s60.75-9.24 74.94-14.7A14 14 0 0 1 222 48m-12 0a2 2 0 0 0-.87-1.66a1.93 1.93 0 0 0-1.85-.21C192.31 52 162.1 61.7 128 61.7S63.69 52 48.72 46.14a2 2 0 0 0-1.85.21A2 2 0 0 0 46 48v55.76C46 171.17 82.79 226 128 226s82-54.83 82-122.22Z"/></svg>
React
import type { SVGProps } from "react";
export function PhMaskHappyLight(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="M188.47 124a6 6 0 1 1-8.94 8c-3.06-3.42-9.74-6-15.53-6s-12.47 2.58-15.53 6a6 6 0 0 1-8.94-8c5.35-6 15.19-10 24.47-10s19.12 4 24.47 10m-80.94 8a6 6 0 1 0 8.94-8c-5.35-6-15.19-10-24.47-10s-19.12 4-24.47 10a6 6 0 1 0 8.94 8c3.06-3.42 9.74-6 15.53-6s12.47 2.58 15.53 6m58.73 31.43a6 6 0 0 0-8.46.67a38.89 38.89 0 0 1-59.6 0a6 6 0 1 0-9.13 7.79a50.9 50.9 0 0 0 77.86 0a6 6 0 0 0-.67-8.46M222 48v55.77c0 35.45-9.53 68.86-26.83 94.06C177.4 223.74 153.54 238 128 238s-49.4-14.26-67.17-40.16C43.53 172.64 34 139.23 34 103.78V48a14 14 0 0 1 19.06-13c14.19 5.46 42.8 14.7 74.94 14.7s60.75-9.24 74.94-14.7A14 14 0 0 1 222 48m-12 0a2 2 0 0 0-.87-1.66a1.93 1.93 0 0 0-1.85-.21C192.31 52 162.1 61.7 128 61.7S63.69 52 48.72 46.14a2 2 0 0 0-1.85.21A2 2 0 0 0 46 48v55.76C46 171.17 82.79 226 128 226s82-54.83 82-122.22Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M188.47 124a6 6 0 1 1-8.94 8c-3.06-3.42-9.74-6-15.53-6s-12.47 2.58-15.53 6a6 6 0 0 1-8.94-8c5.35-6 15.19-10 24.47-10s19.12 4 24.47 10m-80.94 8a6 6 0 1 0 8.94-8c-5.35-6-15.19-10-24.47-10s-19.12 4-24.47 10a6 6 0 1 0 8.94 8c3.06-3.42 9.74-6 15.53-6s12.47 2.58 15.53 6m58.73 31.43a6 6 0 0 0-8.46.67a38.89 38.89 0 0 1-59.6 0a6 6 0 1 0-9.13 7.79a50.9 50.9 0 0 0 77.86 0a6 6 0 0 0-.67-8.46M222 48v55.77c0 35.45-9.53 68.86-26.83 94.06C177.4 223.74 153.54 238 128 238s-49.4-14.26-67.17-40.16C43.53 172.64 34 139.23 34 103.78V48a14 14 0 0 1 19.06-13c14.19 5.46 42.8 14.7 74.94 14.7s60.75-9.24 74.94-14.7A14 14 0 0 1 222 48m-12 0a2 2 0 0 0-.87-1.66a1.93 1.93 0 0 0-1.85-.21C192.31 52 162.1 61.7 128 61.7S63.69 52 48.72 46.14a2 2 0 0 0-1.85.21A2 2 0 0 0 46 48v55.76C46 171.17 82.79 226 128 226s82-54.83 82-122.22Z"/></svg> </template>
CSS
.icon-mask-happy-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%22M188.47%20124a6%206%200%201%201-8.94%208c-3.06-3.42-9.74-6-15.53-6s-12.47%202.58-15.53%206a6%206%200%200%201-8.94-8c5.35-6%2015.19-10%2024.47-10s19.12%204%2024.47%2010m-80.94%208a6%206%200%201%200%208.94-8c-5.35-6-15.19-10-24.47-10s-19.12%204-24.47%2010a6%206%200%201%200%208.94%208c3.06-3.42%209.74-6%2015.53-6s12.47%202.58%2015.53%206m58.73%2031.43a6%206%200%200%200-8.46.67a38.89%2038.89%200%200%201-59.6%200a6%206%200%201%200-9.13%207.79a50.9%2050.9%200%200%200%2077.86%200a6%206%200%200%200-.67-8.46M222%2048v55.77c0%2035.45-9.53%2068.86-26.83%2094.06C177.4%20223.74%20153.54%20238%20128%20238s-49.4-14.26-67.17-40.16C43.53%20172.64%2034%20139.23%2034%20103.78V48a14%2014%200%200%201%2019.06-13c14.19%205.46%2042.8%2014.7%2074.94%2014.7s60.75-9.24%2074.94-14.7A14%2014%200%200%201%20222%2048m-12%200a2%202%200%200%200-.87-1.66a1.93%201.93%200%200%200-1.85-.21C192.31%2052%20162.1%2061.7%20128%2061.7S63.69%2052%2048.72%2046.14a2%202%200%200%200-1.85.21A2%202%200%200%200%2046%2048v55.76C46%20171.17%2082.79%20226%20128%20226s82-54.83%2082-122.22Z%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%22M188.47%20124a6%206%200%201%201-8.94%208c-3.06-3.42-9.74-6-15.53-6s-12.47%202.58-15.53%206a6%206%200%200%201-8.94-8c5.35-6%2015.19-10%2024.47-10s19.12%204%2024.47%2010m-80.94%208a6%206%200%201%200%208.94-8c-5.35-6-15.19-10-24.47-10s-19.12%204-24.47%2010a6%206%200%201%200%208.94%208c3.06-3.42%209.74-6%2015.53-6s12.47%202.58%2015.53%206m58.73%2031.43a6%206%200%200%200-8.46.67a38.89%2038.89%200%200%201-59.6%200a6%206%200%201%200-9.13%207.79a50.9%2050.9%200%200%200%2077.86%200a6%206%200%200%200-.67-8.46M222%2048v55.77c0%2035.45-9.53%2068.86-26.83%2094.06C177.4%20223.74%20153.54%20238%20128%20238s-49.4-14.26-67.17-40.16C43.53%20172.64%2034%20139.23%2034%20103.78V48a14%2014%200%200%201%2019.06-13c14.19%205.46%2042.8%2014.7%2074.94%2014.7s60.75-9.24%2074.94-14.7A14%2014%200%200%201%20222%2048m-12%200a2%202%200%200%200-.87-1.66a1.93%201.93%200%200%200-1.85-.21C192.31%2052%20162.1%2061.7%20128%2061.7S63.69%2052%2048.72%2046.14a2%202%200%200%200-1.85.21A2%202%200%200%200%2046%2048v55.76C46%20171.17%2082.79%20226%20128%20226s82-54.83%2082-122.22Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/mask-happy-light.svg?color=%231a73e8&size=48
