Eye icon

A free eye icon in 5 styles, drawn by hand on a 24px grid. Copy it as SVG or JSX, for personal or commercial use.

Style Stroke

Category: Security & Protection
Size: 24 × 24, scales to any size
License: Free, credit optional (terms)
Tags: eye, on, visibility, view, open, watch, seen

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  <path transform="translate(3 5)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M18 7C18 9 14.5 14 9 14C3.5 14 0 9 0 7C0 5 3.5 0 9 0C14.5 0 18 5 18 7Z"/>
  <path transform="translate(3 5)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M12 7C12 8.66 10.66 10 9 10C7.34 10 6 8.66 6 7C6 5.34 7.34 4 9 4C10.66 4 12 5.34 12 7Z"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  <path transform="translate(2 4)" fill="currentColor" d="M8 8C8 6.9 8.9 6 10 6C11.1 6 12 6.9 12 8C12 9.1 11.1 10 10 10C8.9 10 8 9.1 8 8Z"/>
  <path transform="translate(2 4)" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M2.74 3.03C4.45 1.4 6.93 0 10 0C13.07 0 15.55 1.4 17.26 3.03C18.11 3.85 18.78 4.74 19.24 5.58C19.69 6.39 20 7.26 20 8C20 8.74 19.69 9.61 19.24 10.42C18.78 11.26 18.11 12.15 17.26 12.97C15.55 14.6 13.07 16 10 16C6.93 16 4.45 14.6 2.74 12.97C1.89 12.15 1.22 11.26 0.76 10.42C0.31 9.61 0 8.74 0 8C0 7.26 0.31 6.39 0.76 5.58C1.22 4.74 1.89 3.85 2.74 3.03ZM10 4C7.79 4 6 5.79 6 8C6 10.21 7.79 12 10 12C12.21 12 14 10.21 14 8C14 5.79 12.21 4 10 4Z"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  <path opacity="0.28" transform="translate(3 5)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M9 14C14.5 14 18 9 18 7C18 5 14.5 0 9 0C3.5 0 0 5 0 7C0 9 3.5 14 9 14Z"/>
  <path transform="translate(9 9)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M6 3C6 4.66 4.66 6 3 6C1.34 6 0 4.66 0 3C0 1.34 1.34 0 3 0C4.66 0 6 1.34 6 3Z"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  <path opacity="0.28" transform="translate(2 4)" fill="currentColor" d="M10 0C6.93 0 4.45 1.4 2.74 3.03C1.89 3.85 1.22 4.74 0.76 5.58C0.31 6.39 0 7.26 0 8C0 8.74 0.31 9.61 0.76 10.42C1.22 11.26 1.89 12.15 2.74 12.97C4.45 14.6 6.93 16 10 16C13.07 16 15.55 14.6 17.26 12.97C18.11 12.15 18.78 11.26 19.24 10.42C19.69 9.61 20 8.74 20 8C20 7.26 19.69 6.39 19.24 5.58C18.78 4.74 18.11 3.85 17.26 3.03C15.55 1.4 13.07 0 10 0Z"/>
  <path transform="translate(8 8)" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M0 4C0 1.79 1.79 0 4 0C6.21 0 8 1.79 8 4C8 6.21 6.21 8 4 8C1.79 8 0 6.21 0 4ZM4 2C2.9 2 2 2.9 2 4C2 5.1 2.9 6 4 6C5.1 6 6 5.1 6 4C6 2.9 5.1 2 4 2Z"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  <path opacity="0.28" transform="translate(3 5)" fill="currentColor" d="M18 7C18 9 14.5 14 9 14C3.5 14 0 9 0 7C0 5 3.5 0 9 0C14.5 0 18 5 18 7Z"/>
  <path transform="translate(3 5)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M18 7C18 9 14.5 14 9 14C3.5 14 0 9 0 7C0 5 3.5 0 9 0C14.5 0 18 5 18 7Z"/>
  <path transform="translate(3 5)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M12 7C12 8.66 10.66 10 9 10C7.34 10 6 8.66 6 7C6 5.34 7.34 4 9 4C10.66 4 12 5.34 12 7Z"/>
</svg>