eye closed icon

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

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

5 other variants in Phosphor

eye-closed eye-closed-bold eye-closed-duotone eye-closed-fill eye-closed-light

The same icon in other sets

eye-closedAkar Icons eye-closedHuge Icons eye-closedIconoir eye-closedLucide eye-closedMage Icons eye-closedMaterial Design Icons eye-closedOcticons eye-closedPixelarticons eye-closedRadix Icons eye-closed-boldSolar eye-closedTabler Icons eye-closed-outlineTeenyicons

Related icons in Phosphor

eye-slash

Use the eye closed icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M226 171.47a3.9 3.9 0 0 1-2 .53a4 4 0 0 1-3.47-2l-21.15-37a120 120 0 0 1-41.91 19.53l6.53 38.81a4 4 0 0 1-3.29 4.6a4 4 0 0 1-.67.06a4 4 0 0 1-3.94-3.34l-6.41-38.5a128.2 128.2 0 0 1-43.28 0l-6.41 38.5a4 4 0 0 1-4 3.34a4 4 0 0 1-.67-.06a4 4 0 0 1-3.29-4.6l6.48-38.83A120 120 0 0 1 56.62 133l-21.15 37a4 4 0 0 1-3.47 2a3.9 3.9 0 0 1-2-.53a4 4 0 0 1-1.47-5.47l21.68-37.94a148.2 148.2 0 0 1-21.32-21.56a4 4 0 1 1 6.22-5C52.25 122.71 82.29 148 128 148s75.75-25.29 92.89-46.51a4 4 0 1 1 6.22 5a148.2 148.2 0 0 1-21.32 21.56L227.47 166a4 4 0 0 1-1.47 5.47"/></svg>

React

import type { SVGProps } from "react";

export function PhEyeClosedThin(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="M226 171.47a3.9 3.9 0 0 1-2 .53a4 4 0 0 1-3.47-2l-21.15-37a120 120 0 0 1-41.91 19.53l6.53 38.81a4 4 0 0 1-3.29 4.6a4 4 0 0 1-.67.06a4 4 0 0 1-3.94-3.34l-6.41-38.5a128.2 128.2 0 0 1-43.28 0l-6.41 38.5a4 4 0 0 1-4 3.34a4 4 0 0 1-.67-.06a4 4 0 0 1-3.29-4.6l6.48-38.83A120 120 0 0 1 56.62 133l-21.15 37a4 4 0 0 1-3.47 2a3.9 3.9 0 0 1-2-.53a4 4 0 0 1-1.47-5.47l21.68-37.94a148.2 148.2 0 0 1-21.32-21.56a4 4 0 1 1 6.22-5C52.25 122.71 82.29 148 128 148s75.75-25.29 92.89-46.51a4 4 0 1 1 6.22 5a148.2 148.2 0 0 1-21.32 21.56L227.47 166a4 4 0 0 1-1.47 5.47"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M226 171.47a3.9 3.9 0 0 1-2 .53a4 4 0 0 1-3.47-2l-21.15-37a120 120 0 0 1-41.91 19.53l6.53 38.81a4 4 0 0 1-3.29 4.6a4 4 0 0 1-.67.06a4 4 0 0 1-3.94-3.34l-6.41-38.5a128.2 128.2 0 0 1-43.28 0l-6.41 38.5a4 4 0 0 1-4 3.34a4 4 0 0 1-.67-.06a4 4 0 0 1-3.29-4.6l6.48-38.83A120 120 0 0 1 56.62 133l-21.15 37a4 4 0 0 1-3.47 2a3.9 3.9 0 0 1-2-.53a4 4 0 0 1-1.47-5.47l21.68-37.94a148.2 148.2 0 0 1-21.32-21.56a4 4 0 1 1 6.22-5C52.25 122.71 82.29 148 128 148s75.75-25.29 92.89-46.51a4 4 0 1 1 6.22 5a148.2 148.2 0 0 1-21.32 21.56L227.47 166a4 4 0 0 1-1.47 5.47"/></svg>
</template>

CSS

.icon-eye-closed-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%22M226%20171.47a3.9%203.9%200%200%201-2%20.53a4%204%200%200%201-3.47-2l-21.15-37a120%20120%200%200%201-41.91%2019.53l6.53%2038.81a4%204%200%200%201-3.29%204.6a4%204%200%200%201-.67.06a4%204%200%200%201-3.94-3.34l-6.41-38.5a128.2%20128.2%200%200%201-43.28%200l-6.41%2038.5a4%204%200%200%201-4%203.34a4%204%200%200%201-.67-.06a4%204%200%200%201-3.29-4.6l6.48-38.83A120%20120%200%200%201%2056.62%20133l-21.15%2037a4%204%200%200%201-3.47%202a3.9%203.9%200%200%201-2-.53a4%204%200%200%201-1.47-5.47l21.68-37.94a148.2%20148.2%200%200%201-21.32-21.56a4%204%200%201%201%206.22-5C52.25%20122.71%2082.29%20148%20128%20148s75.75-25.29%2092.89-46.51a4%204%200%201%201%206.22%205a148.2%20148.2%200%200%201-21.32%2021.56L227.47%20166a4%204%200%200%201-1.47%205.47%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%22M226%20171.47a3.9%203.9%200%200%201-2%20.53a4%204%200%200%201-3.47-2l-21.15-37a120%20120%200%200%201-41.91%2019.53l6.53%2038.81a4%204%200%200%201-3.29%204.6a4%204%200%200%201-.67.06a4%204%200%200%201-3.94-3.34l-6.41-38.5a128.2%20128.2%200%200%201-43.28%200l-6.41%2038.5a4%204%200%200%201-4%203.34a4%204%200%200%201-.67-.06a4%204%200%200%201-3.29-4.6l6.48-38.83A120%20120%200%200%201%2056.62%20133l-21.15%2037a4%204%200%200%201-3.47%202a3.9%203.9%200%200%201-2-.53a4%204%200%200%201-1.47-5.47l21.68-37.94a148.2%20148.2%200%200%201-21.32-21.56a4%204%200%201%201%206.22-5C52.25%20122.71%2082.29%20148%20128%20148s75.75-25.29%2092.89-46.51a4%204%200%201%201%206.22%205a148.2%20148.2%200%200%201-21.32%2021.56L227.47%20166a4%204%200%200%201-1.47%205.47%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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