eye icon

eye from Font Awesome Solid by Dave Gandy · Solid · Design · CC-BY-4.0 Attribution required.

Name
eye
Set
Font Awesome Solid
Style
Solid
Category
Design
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

eyeAkar Iconseye-filledAnt Design IconseyeBootstrap IconseyeCodiconseyeEmoji One (Colored)eye-fillEva IconseyeFramework7 IconseyeFont Awesome 6 RegulareyeFont Awesome 6 SolideyeFont Awesome RegulareyeFeather Iconseye-outlineFlowbite Iconseye-12-filledFluent UI System IconseyeFluent EmojieyeFluent Emoji FlateyeFluent Emoji High ContrasteyeFirefox OS Emojieyecss.ggeyeHealth IconseyeHeroIconseyeHuge IconseyeHumbleiconseyeIconoireyeIonIcons

More design icons from Font Awesome Solid

adjustbezier-curveclonecropcrop-altcrosshairsdraw-polygoneye-droppereye-slashfillfill-driplayer-groupmagicobject-groupobject-ungrouppaint-brushpalettesplotchspray-canstampswatchbooktinttint-slasheye-dropper-empty

Use the eye icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M320 96c-80.8 0-145.5 36.8-192.6 80.6c-46.8 43.5-78.1 95.4-93 131.1c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 507.1 239.2 544 320 544s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 132.9 400.8 96 320 96M176 320c0-79.5 64.5-144 144-144s144 64.5 144 144s-64.5 144-144 144s-144-64.5-144-144m144-64c0 35.3-28.7 64-64 64c-11.5 0-22.3-3-31.7-8.4c-1 10.9-.1 22.1 2.9 33.2c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-12.2-45.7-55.5-74.8-101.1-70.8c5.3 9.3 8.4 20.1 8.4 31.7"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidEye(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 96c-80.8 0-145.5 36.8-192.6 80.6c-46.8 43.5-78.1 95.4-93 131.1c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 507.1 239.2 544 320 544s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 132.9 400.8 96 320 96M176 320c0-79.5 64.5-144 144-144s144 64.5 144 144s-64.5 144-144 144s-144-64.5-144-144m144-64c0 35.3-28.7 64-64 64c-11.5 0-22.3-3-31.7-8.4c-1 10.9-.1 22.1 2.9 33.2c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-12.2-45.7-55.5-74.8-101.1-70.8c5.3 9.3 8.4 20.1 8.4 31.7"/></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 96c-80.8 0-145.5 36.8-192.6 80.6c-46.8 43.5-78.1 95.4-93 131.1c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 507.1 239.2 544 320 544s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 132.9 400.8 96 320 96M176 320c0-79.5 64.5-144 144-144s144 64.5 144 144s-64.5 144-144 144s-144-64.5-144-144m144-64c0 35.3-28.7 64-64 64c-11.5 0-22.3-3-31.7-8.4c-1 10.9-.1 22.1 2.9 33.2c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-12.2-45.7-55.5-74.8-101.1-70.8c5.3 9.3 8.4 20.1 8.4 31.7"/></svg>
</template>

CSS

.icon-eye {
  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%2096c-80.8%200-145.5%2036.8-192.6%2080.6c-46.8%2043.5-78.1%2095.4-93%20131.1c-3.3%207.9-3.3%2016.7%200%2024.6c14.9%2035.7%2046.2%2087.7%2093%20131.1C174.5%20507.1%20239.2%20544%20320%20544s145.5-36.8%20192.6-80.6c46.8-43.5%2078.1-95.4%2093-131.1c3.3-7.9%203.3-16.7%200-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5%20132.9%20400.8%2096%20320%2096M176%20320c0-79.5%2064.5-144%20144-144s144%2064.5%20144%20144s-64.5%20144-144%20144s-144-64.5-144-144m144-64c0%2035.3-28.7%2064-64%2064c-11.5%200-22.3-3-31.7-8.4c-1%2010.9-.1%2022.1%202.9%2033.2c13.7%2051.2%2066.4%2081.6%20117.6%2067.9s81.6-66.4%2067.9-117.6c-12.2-45.7-55.5-74.8-101.1-70.8c5.3%209.3%208.4%2020.1%208.4%2031.7%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%2096c-80.8%200-145.5%2036.8-192.6%2080.6c-46.8%2043.5-78.1%2095.4-93%20131.1c-3.3%207.9-3.3%2016.7%200%2024.6c14.9%2035.7%2046.2%2087.7%2093%20131.1C174.5%20507.1%20239.2%20544%20320%20544s145.5-36.8%20192.6-80.6c46.8-43.5%2078.1-95.4%2093-131.1c3.3-7.9%203.3-16.7%200-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5%20132.9%20400.8%2096%20320%2096M176%20320c0-79.5%2064.5-144%20144-144s144%2064.5%20144%20144s-64.5%20144-144%20144s-144-64.5-144-144m144-64c0%2035.3-28.7%2064-64%2064c-11.5%200-22.3-3-31.7-8.4c-1%2010.9-.1%2022.1%202.9%2033.2c13.7%2051.2%2066.4%2081.6%20117.6%2067.9s81.6-66.4%2067.9-117.6c-12.2-45.7-55.5-74.8-101.1-70.8c5.3%209.3%208.4%2020.1%208.4%2031.7%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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