mask icon

mask from Font Awesome Solid by Dave Gandy · Solid · Halloween · CC-BY-4.0 Attribution required.

Name: mask
Set: Font Awesome Solid
Style: Solid
Category: Halloween
Viewbox: 640×640
License: CC BY 4.0

The same icon in other sets

maskBootstrap Icons maskBoxIcons v2 maskBoxIcons v2 Solid maskFont Awesome 6 Solid maskHuge Icons maskIconPark maskIconPark Outline maskIconPark Solid maskIconPark TwoTone maskJam Icons maskLine Awesome maskMyna UI Icons maskTabler Icons maskWeb3 Icons maskWeb3 Icons Branded

More halloween icons from Font Awesome Solid

book-dead broom cloud-moon mask-face mask-ventilator

Use the mask icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M320 128C96 128 32 224 32 336s80 176 176 176h8.4c24.2 0 46.4-13.7 57.2-35.4l23.2-46.3c4.4-8.8 13.3-14.3 23.2-14.3s18.8 5.5 23.2 14.3l23.2 46.3c10.8 21.7 33 35.4 57.2 35.4h8.4c96 0 176-64 176-176s-64-208-288-208M128 320c0-35.3 28.7-64 64-64s64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64m320-64c35.3 0 64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64s28.7-64 64-64"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidMask(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M320 128C96 128 32 224 32 336s80 176 176 176h8.4c24.2 0 46.4-13.7 57.2-35.4l23.2-46.3c4.4-8.8 13.3-14.3 23.2-14.3s18.8 5.5 23.2 14.3l23.2 46.3c10.8 21.7 33 35.4 57.2 35.4h8.4c96 0 176-64 176-176s-64-208-288-208M128 320c0-35.3 28.7-64 64-64s64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64m320-64c35.3 0 64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64s28.7-64 64-64"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M320 128C96 128 32 224 32 336s80 176 176 176h8.4c24.2 0 46.4-13.7 57.2-35.4l23.2-46.3c4.4-8.8 13.3-14.3 23.2-14.3s18.8 5.5 23.2 14.3l23.2 46.3c10.8 21.7 33 35.4 57.2 35.4h8.4c96 0 176-64 176-176s-64-208-288-208M128 320c0-35.3 28.7-64 64-64s64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64m320-64c35.3 0 64 28.7 64 64s-28.7 64-64 64s-64-28.7-64-64s28.7-64 64-64"/></svg>
</template>

CSS

.icon-mask {
  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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M320%20128C96%20128%2032%20224%2032%20336s80%20176%20176%20176h8.4c24.2%200%2046.4-13.7%2057.2-35.4l23.2-46.3c4.4-8.8%2013.3-14.3%2023.2-14.3s18.8%205.5%2023.2%2014.3l23.2%2046.3c10.8%2021.7%2033%2035.4%2057.2%2035.4h8.4c96%200%20176-64%20176-176s-64-208-288-208M128%20320c0-35.3%2028.7-64%2064-64s64%2028.7%2064%2064s-28.7%2064-64%2064s-64-28.7-64-64m320-64c35.3%200%2064%2028.7%2064%2064s-28.7%2064-64%2064s-64-28.7-64-64s28.7-64%2064-64%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M320%20128C96%20128%2032%20224%2032%20336s80%20176%20176%20176h8.4c24.2%200%2046.4-13.7%2057.2-35.4l23.2-46.3c4.4-8.8%2013.3-14.3%2023.2-14.3s18.8%205.5%2023.2%2014.3l23.2%2046.3c10.8%2021.7%2033%2035.4%2057.2%2035.4h8.4c96%200%20176-64%20176-176s-64-208-288-208M128%20320c0-35.3%2028.7-64%2064-64s64%2028.7%2064%2064s-28.7%2064-64%2064s-64-28.7-64-64m320-64c35.3%200%2064%2028.7%2064%2064s-28.7%2064-64%2064s-64-28.7-64-64s28.7-64%2064-64%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/mask.svg?color=%231a73e8&size=48