eye icon
eye-16 from Octicons by GitHub · 16 · MIT Free for personal and commercial use.
- Name
- eye-16
- Set
- Octicons
- Style
- 16
- Viewbox
- 16×16
- License
- MIT
2 other variants in Octicons
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 RegulareyeFont Awesome SolideyeFeather Iconseye-outlineFlowbite Iconseye-12-filledFluent UI System IconseyeFluent EmojieyeFluent Emoji FlateyeFluent Emoji High ContrasteyeFirefox OS Emojieyecss.ggeyeHealth IconseyeHeroIconseyeHuge IconseyeHumbleiconseyeIconoir
Related icons in Octicons
Use the eye icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 2c1.981 0 3.671.992 4.933 2.078c1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14s-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2M1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5s2.825-.742 3.955-1.715c1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5s-2.825.742-3.955 1.715c-1.124.967-1.954 2.096-2.366 2.717M8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10"/></svg>
React
import type { SVGProps } from "react";
export function OcticonEye16(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 2c1.981 0 3.671.992 4.933 2.078c1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14s-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2M1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5s2.825-.742 3.955-1.715c1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5s-2.825.742-3.955 1.715c-1.124.967-1.954 2.096-2.366 2.717M8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 2c1.981 0 3.671.992 4.933 2.078c1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14s-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2M1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5s2.825-.742 3.955-1.715c1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5s-2.825.742-3.955 1.715c-1.124.967-1.954 2.096-2.366 2.717M8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10"/></svg> </template>
CSS
.icon-eye-16 {
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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%202c1.981%200%203.671.992%204.933%202.078c1.27%201.091%202.187%202.345%202.637%203.023a1.62%201.62%200%200%201%200%201.798c-.45.678-1.367%201.932-2.637%203.023C11.67%2013.008%209.981%2014%208%2014s-3.671-.992-4.933-2.078C1.797%2010.83.88%209.576.43%208.898a1.62%201.62%200%200%201%200-1.798c.45-.677%201.367-1.931%202.637-3.022C4.33%202.992%206.019%202%208%202M1.679%207.932a.12.12%200%200%200%200%20.136c.411.622%201.241%201.75%202.366%202.717C5.176%2011.758%206.527%2012.5%208%2012.5s2.825-.742%203.955-1.715c1.124-.967%201.954-2.096%202.366-2.717a.12.12%200%200%200%200-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824%204.242%209.473%203.5%208%203.5s-2.825.742-3.955%201.715c-1.124.967-1.954%202.096-2.366%202.717M8%2010a2%202%200%201%201-.001-3.999A2%202%200%200%201%208%2010%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%202c1.981%200%203.671.992%204.933%202.078c1.27%201.091%202.187%202.345%202.637%203.023a1.62%201.62%200%200%201%200%201.798c-.45.678-1.367%201.932-2.637%203.023C11.67%2013.008%209.981%2014%208%2014s-3.671-.992-4.933-2.078C1.797%2010.83.88%209.576.43%208.898a1.62%201.62%200%200%201%200-1.798c.45-.677%201.367-1.931%202.637-3.022C4.33%202.992%206.019%202%208%202M1.679%207.932a.12.12%200%200%200%200%20.136c.411.622%201.241%201.75%202.366%202.717C5.176%2011.758%206.527%2012.5%208%2012.5s2.825-.742%203.955-1.715c1.124-.967%201.954-2.096%202.366-2.717a.12.12%200%200%200%200-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824%204.242%209.473%203.5%208%203.5s-2.825.742-3.955%201.715c-1.124.967-1.954%202.096-2.366%202.717M8%2010a2%202%200%201%201-.001-3.999A2%202%200%200%201%208%2010%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/octicon/eye-16.svg?color=%231a73e8&size=48
