Add mask icon

[Rohitgomane]

What is the purpose of this pull request?

• [x] New Icon
• [ ] Bug fix
• [ ] New Feature
• [ ] Documentation update
• [ ] Other:

Description

A mask icon.

Icon use case

A mask icon can be used in Medical / Health related apps.

Alternative icon designs

Icon Design Checklist

Concept

• [x] I have provided valid use cases for each icon.
• [x] I have not added any a brand or logo icon.
• [x] I have not used any hate symbols.
• [x] I have not included any religious or political imagery.

Author, credits & license

• [x] The icons are solely my own creation.
• [ ] The icons were originally created in #<issueNumber> by @<githubUser>
• [ ] I've based them on the following Lucide icons:
• [ ] I've based them on the following design:

Naming

• [x] I've read and followed the naming conventions
• [x] I've named icons by what they are rather than their use case.
• [x] I've provided meta JSON files in icons/[iconName].json.

Design

• [x] I've read and followed the icon design guidelines
• [x] I've made sure that the icons look sharp on low DPI displays.
• [x] I've made sure that the icons look consistent with the icon set in size, optical volume and density.
• [x] I've made sure that the icons are visually centered.
• [x] I've correctly optimized all icons to two points of precision.

Before Submitting

• [x] I've read the Contribution Guidelines.
• [x] I've checked if there was an existing PR that solves the same issue.

[github-actions[bot]]

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview (24px)

Icon X-rays

Icons as code

Works for: lucide-react, lucide-react-native, lucide-preact, lucide-vue-next

const MaskIcon = createLucideIcon('Mask', [
  ["path",{"d":"m18 9.214-.162 2.14c-.196 2.58-1.967 4.757-4.425 5.438l-.115.031a4.86 4.86 0 0 1-2.596 0l-.115-.031c-2.458-.681-4.23-2.858-4.425-5.437L6 9.214 10.524 7.3a3.783 3.783 0 0 1 2.952 0z"}],
  ["path",{"d":"M18 9c.5-1 1-2 2-2 .88 0 2 .5 2 2s-.3 2-1.5 4-3.058 2.822-5 3"}],
  ["path",{"d":"M6 9c-.5-1-1-2-2-2-.88 0-2 .5-2 2s.3 2 1.5 4 3.058 2.822 5 3"}]
])

[ericfennis]

Maybe add some line in the mask itself?

Or try simpler designs like:

To me, it looks a bit like a top of a trophy.

We should also rename this one, mask is too general. We could maybe go for medical-mask or medical-face-mask?

[github-actions[bot]]

This PR is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[midnight-wonderer]

Maybe add some line in the mask itself? To me, it looks a bit like a top of a trophy.

Yeah, that is what you get by removing the nosewire. It is difficult to make a mask icon because there are not many ways to differentiate between the earloop and the filter part.

I tried with a different design.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
   width="24"
   height="24"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"
   stroke-width="2"
   stroke-linecap="round"
   stroke-linejoin="round"
   version="1.1"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg">
  <g transform="matrix(0.71914147,0,0,0.71914147,24.264332,4.066764)">
    <path d="m -32.036603,3.9012137 c -0.851748,1.145993 -0.414694,7.1245473 0.914409,10.1788183 1.329105,3.05427 4.0215,6.41878 6.700388,7.965437 2.501529,1.444258 7.509845,-0.754746 10.12574,-2.87985 2.800025,-2.274687 5.0672067,-4.417396 7.2671547,-7.169664 2.072824,-2.5932263 5.065449,-6.0085493 4.364417,-8.6248343 -0.342373,-1.277754 -2.035846,-2.056101 -3.197886,-1.790313 -2.713406,0.620629 -5.8416177,3.069958 -9.0458647,3.397193 -1.614072,0.164836 -2.978353,-0.211356 -4.808514,-0.75484 -1.830159,-0.543486 -4.280088,-2.646474 -6.025861,-2.646474 -1.136935,0 -3.274122,1.40172 -3.636822,1.611124 -0.957105,0.552585 -2.429521,0.407123 -2.657161,0.713403 z" />
    <path d="m -14.200005,4.8724257 c 0,0 0.203289,4.390415 0.582948,6.4646433 0.524532,2.865709 1.897736,5.627475 1.897736,5.627475" />
  </g>
</svg>

This one looks better, in my opinion, because the top part curves and acts like a cue for the nose. What do you guys think? Rohit, Jakob, Eric

[midnight-wonderer]

Wow, you guys have an online editor? Nice.

Here you go, for inspection.

[ericfennis]

@Rohitgomane To me, the design on 100% is not quite recognizable as a mask. Can try some other variants?