mask icon

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

Name: mask
Set: Font Awesome 6 Solid
Style: Regular
Category: Halloween
Viewbox: 576×512
License: CC BY 4.0

The same icon in other sets

maskBootstrap Icons maskBoxIcons v2 maskBoxIcons v2 Solid maskFont Awesome 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 6 Solid

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 576 512"><path fill="currentColor" d="M288 64C64 64 0 160 0 272s80 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-176S512 64 288 64M96 256a64 64 0 1 1 128 0a64 64 0 1 1-128 0m320-64a64 64 0 1 1 0 128a64 64 0 1 1 0-128"/></svg>

React

import type { SVGProps } from "react";

export function Fa6SolidMask(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M288 64C64 64 0 160 0 272s80 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-176S512 64 288 64M96 256a64 64 0 1 1 128 0a64 64 0 1 1-128 0m320-64a64 64 0 1 1 0 128a64 64 0 1 1 0-128"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M288 64C64 64 0 160 0 272s80 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-176S512 64 288 64M96 256a64 64 0 1 1 128 0a64 64 0 1 1-128 0m320-64a64 64 0 1 1 0 128a64 64 0 1 1 0-128"/></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%20576%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M288%2064C64%2064%200%20160%200%20272s80%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-176S512%2064%20288%2064M96%20256a64%2064%200%201%201%20128%200a64%2064%200%201%201-128%200m320-64a64%2064%200%201%201%200%20128a64%2064%200%201%201%200-128%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%20576%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M288%2064C64%2064%200%20160%200%20272s80%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-176S512%2064%20288%2064M96%20256a64%2064%200%201%201%20128%200a64%2064%200%201%201-128%200m320-64a64%2064%200%201%201%200%20128a64%2064%200%201%201%200-128%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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