visor icon

visor-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name: visor-thin
Set: Phosphor
Style: Thin
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

visor visor-bold visor-duotone visor-fill visor-light

Use the visor icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M183.05 60H72a68 68 0 0 0-67.93 71.21c1.6 34.66 30 63.08 64.65 64.71c14.77.72 30-5.64 46.63-19.38a19.9 19.9 0 0 1 25.35 0C150.79 184.92 166.25 196 184 196a68 68 0 0 0 68-68.9c-.49-37-31.42-67.1-68.95-67.1m43.65 110.15A59.57 59.57 0 0 1 184 188c-15.17 0-29.07-10-38.2-17.58a27.88 27.88 0 0 0-35.55 0c-15 12.41-28.45 18.14-41.15 17.55a60.37 60.37 0 0 1-57-57.09A60 60 0 0 1 72 68h111.05c33.18 0 60.52 26.56 60.94 59.2a59.6 59.6 0 0 1-17.29 42.95M180 96a4 4 0 0 1-4 4H80a4 4 0 0 1 0-8h96a4 4 0 0 1 4 4"/></svg>

React

import type { SVGProps } from "react";

export function PhVisorThin(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="M183.05 60H72a68 68 0 0 0-67.93 71.21c1.6 34.66 30 63.08 64.65 64.71c14.77.72 30-5.64 46.63-19.38a19.9 19.9 0 0 1 25.35 0C150.79 184.92 166.25 196 184 196a68 68 0 0 0 68-68.9c-.49-37-31.42-67.1-68.95-67.1m43.65 110.15A59.57 59.57 0 0 1 184 188c-15.17 0-29.07-10-38.2-17.58a27.88 27.88 0 0 0-35.55 0c-15 12.41-28.45 18.14-41.15 17.55a60.37 60.37 0 0 1-57-57.09A60 60 0 0 1 72 68h111.05c33.18 0 60.52 26.56 60.94 59.2a59.6 59.6 0 0 1-17.29 42.95M180 96a4 4 0 0 1-4 4H80a4 4 0 0 1 0-8h96a4 4 0 0 1 4 4"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M183.05 60H72a68 68 0 0 0-67.93 71.21c1.6 34.66 30 63.08 64.65 64.71c14.77.72 30-5.64 46.63-19.38a19.9 19.9 0 0 1 25.35 0C150.79 184.92 166.25 196 184 196a68 68 0 0 0 68-68.9c-.49-37-31.42-67.1-68.95-67.1m43.65 110.15A59.57 59.57 0 0 1 184 188c-15.17 0-29.07-10-38.2-17.58a27.88 27.88 0 0 0-35.55 0c-15 12.41-28.45 18.14-41.15 17.55a60.37 60.37 0 0 1-57-57.09A60 60 0 0 1 72 68h111.05c33.18 0 60.52 26.56 60.94 59.2a59.6 59.6 0 0 1-17.29 42.95M180 96a4 4 0 0 1-4 4H80a4 4 0 0 1 0-8h96a4 4 0 0 1 4 4"/></svg>
</template>

CSS

.icon-visor-thin {
  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%22M183.05%2060H72a68%2068%200%200%200-67.93%2071.21c1.6%2034.66%2030%2063.08%2064.65%2064.71c14.77.72%2030-5.64%2046.63-19.38a19.9%2019.9%200%200%201%2025.35%200C150.79%20184.92%20166.25%20196%20184%20196a68%2068%200%200%200%2068-68.9c-.49-37-31.42-67.1-68.95-67.1m43.65%20110.15A59.57%2059.57%200%200%201%20184%20188c-15.17%200-29.07-10-38.2-17.58a27.88%2027.88%200%200%200-35.55%200c-15%2012.41-28.45%2018.14-41.15%2017.55a60.37%2060.37%200%200%201-57-57.09A60%2060%200%200%201%2072%2068h111.05c33.18%200%2060.52%2026.56%2060.94%2059.2a59.6%2059.6%200%200%201-17.29%2042.95M180%2096a4%204%200%200%201-4%204H80a4%204%200%200%201%200-8h96a4%204%200%200%201%204%204%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%22M183.05%2060H72a68%2068%200%200%200-67.93%2071.21c1.6%2034.66%2030%2063.08%2064.65%2064.71c14.77.72%2030-5.64%2046.63-19.38a19.9%2019.9%200%200%201%2025.35%200C150.79%20184.92%20166.25%20196%20184%20196a68%2068%200%200%200%2068-68.9c-.49-37-31.42-67.1-68.95-67.1m43.65%20110.15A59.57%2059.57%200%200%201%20184%20188c-15.17%200-29.07-10-38.2-17.58a27.88%2027.88%200%200%200-35.55%200c-15%2012.41-28.45%2018.14-41.15%2017.55a60.37%2060.37%200%200%201-57-57.09A60%2060%200%200%201%2072%2068h111.05c33.18%200%2060.52%2026.56%2060.94%2059.2a59.6%2059.6%200%200%201-17.29%2042.95M180%2096a4%204%200%200%201-4%204H80a4%204%200%200%201%200-8h96a4%204%200%200%201%204%204%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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