eye lines icon
eye-lines-28-filled from Fluent UI System Icons by Microsoft Corporation · 28 Filled · MIT Free for personal and commercial use.
- Name
- eye-lines-28-filled
- Set
- Fluent UI System Icons
- Style
- 28 Filled
- Viewbox
- 28×28
- License
- MIT
9 other variants in Fluent UI System Icons
Related icons in Fluent UI System Icons
Use the eye lines icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M8.039 5.5C9.659 4.601 11.637 4 14 4c4.255 0 7.258 1.947 9.182 4.075a13.5 13.5 0 0 1 2.11 3.116c.23.474.402.913.52 1.293c.112.366.188.723.188 1.016c0 .522-.226 1.366-.636 2.287a12.5 12.5 0 0 1-2.01 3.13C21.473 21.06 18.463 23 14 23c-2.482 0-4.513-.6-6.152-1.5H14v-1H6.326A12 12 0 0 1 4.721 19h9.28v-1a4.5 4.5 0 0 0 0-9V8H4.886c.478-.52 1.021-1.03 1.632-1.5H14v-1zM14 9H4.054c-.385.51-.712 1.018-.984 1.5h7.576A4.5 4.5 0 0 1 14 9m-4.032 2.5H2.564a9 9 0 0 0-.375.984q-.083.265-.133.516h7.471a4.5 4.5 0 0 1 .44-1.5m-.44 2.5H2.05c.075.422.232.941.462 1.5h7.455a4.5 4.5 0 0 1-.44-1.5m1.118 2.5H2.983c.255.482.564.99.934 1.5H14a4.5 4.5 0 0 1-3.354-1.5"/></svg>
React
import type { SVGProps } from "react";
export function FluentEyeLines28Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M8.039 5.5C9.659 4.601 11.637 4 14 4c4.255 0 7.258 1.947 9.182 4.075a13.5 13.5 0 0 1 2.11 3.116c.23.474.402.913.52 1.293c.112.366.188.723.188 1.016c0 .522-.226 1.366-.636 2.287a12.5 12.5 0 0 1-2.01 3.13C21.473 21.06 18.463 23 14 23c-2.482 0-4.513-.6-6.152-1.5H14v-1H6.326A12 12 0 0 1 4.721 19h9.28v-1a4.5 4.5 0 0 0 0-9V8H4.886c.478-.52 1.021-1.03 1.632-1.5H14v-1zM14 9H4.054c-.385.51-.712 1.018-.984 1.5h7.576A4.5 4.5 0 0 1 14 9m-4.032 2.5H2.564a9 9 0 0 0-.375.984q-.083.265-.133.516h7.471a4.5 4.5 0 0 1 .44-1.5m-.44 2.5H2.05c.075.422.232.941.462 1.5h7.455a4.5 4.5 0 0 1-.44-1.5m1.118 2.5H2.983c.255.482.564.99.934 1.5H14a4.5 4.5 0 0 1-3.354-1.5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M8.039 5.5C9.659 4.601 11.637 4 14 4c4.255 0 7.258 1.947 9.182 4.075a13.5 13.5 0 0 1 2.11 3.116c.23.474.402.913.52 1.293c.112.366.188.723.188 1.016c0 .522-.226 1.366-.636 2.287a12.5 12.5 0 0 1-2.01 3.13C21.473 21.06 18.463 23 14 23c-2.482 0-4.513-.6-6.152-1.5H14v-1H6.326A12 12 0 0 1 4.721 19h9.28v-1a4.5 4.5 0 0 0 0-9V8H4.886c.478-.52 1.021-1.03 1.632-1.5H14v-1zM14 9H4.054c-.385.51-.712 1.018-.984 1.5h7.576A4.5 4.5 0 0 1 14 9m-4.032 2.5H2.564a9 9 0 0 0-.375.984q-.083.265-.133.516h7.471a4.5 4.5 0 0 1 .44-1.5m-.44 2.5H2.05c.075.422.232.941.462 1.5h7.455a4.5 4.5 0 0 1-.44-1.5m1.118 2.5H2.983c.255.482.564.99.934 1.5H14a4.5 4.5 0 0 1-3.354-1.5"/></svg> </template>
CSS
.icon-eye-lines-28-filled {
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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.039%205.5C9.659%204.601%2011.637%204%2014%204c4.255%200%207.258%201.947%209.182%204.075a13.5%2013.5%200%200%201%202.11%203.116c.23.474.402.913.52%201.293c.112.366.188.723.188%201.016c0%20.522-.226%201.366-.636%202.287a12.5%2012.5%200%200%201-2.01%203.13C21.473%2021.06%2018.463%2023%2014%2023c-2.482%200-4.513-.6-6.152-1.5H14v-1H6.326A12%2012%200%200%201%204.721%2019h9.28v-1a4.5%204.5%200%200%200%200-9V8H4.886c.478-.52%201.021-1.03%201.632-1.5H14v-1zM14%209H4.054c-.385.51-.712%201.018-.984%201.5h7.576A4.5%204.5%200%200%201%2014%209m-4.032%202.5H2.564a9%209%200%200%200-.375.984q-.083.265-.133.516h7.471a4.5%204.5%200%200%201%20.44-1.5m-.44%202.5H2.05c.075.422.232.941.462%201.5h7.455a4.5%204.5%200%200%201-.44-1.5m1.118%202.5H2.983c.255.482.564.99.934%201.5H14a4.5%204.5%200%200%201-3.354-1.5%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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.039%205.5C9.659%204.601%2011.637%204%2014%204c4.255%200%207.258%201.947%209.182%204.075a13.5%2013.5%200%200%201%202.11%203.116c.23.474.402.913.52%201.293c.112.366.188.723.188%201.016c0%20.522-.226%201.366-.636%202.287a12.5%2012.5%200%200%201-2.01%203.13C21.473%2021.06%2018.463%2023%2014%2023c-2.482%200-4.513-.6-6.152-1.5H14v-1H6.326A12%2012%200%200%201%204.721%2019h9.28v-1a4.5%204.5%200%200%200%200-9V8H4.886c.478-.52%201.021-1.03%201.632-1.5H14v-1zM14%209H4.054c-.385.51-.712%201.018-.984%201.5h7.576A4.5%204.5%200%200%201%2014%209m-4.032%202.5H2.564a9%209%200%200%200-.375.984q-.083.265-.133.516h7.471a4.5%204.5%200%200%201%20.44-1.5m-.44%202.5H2.05c.075.422.232.941.462%201.5h7.455a4.5%204.5%200%200%201-.44-1.5m1.118%202.5H2.983c.255.482.564.99.934%201.5H14a4.5%204.5%200%200%201-3.354-1.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/eye-lines-28-filled.svg?color=%231a73e8&size=48
