signature icon

Signature: signature, sign, signing. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Code line-round

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M3.864 8.687C3.616 7.948 3.417 7.157 3.266 6.315C3.089 5.328 3 4.39 3 3.5C3 3.182 3.059 2.875 3.176 2.58C3.303 2.259 3.488 1.976 3.732 1.732C3.976 1.488 4.259 1.303 4.58 1.176C4.875 1.059 5.182 1 5.5 1C5.818 1 6.125 1.059 6.42 1.176C6.741 1.303 7.024 1.488 7.268 1.732C7.512 1.976 7.697 2.259 7.824 2.58C7.941 2.875 8 3.182 8 3.5C8 4.747 7.274 6.249 5.823 8.006C5.571 8.31 5.302 8.618 5.014 8.928C5.261 9.563 5.523 10.069 5.801 10.445C5.949 10.646 6.091 10.795 6.228 10.891C6.332 10.964 6.422 11 6.5 11C6.687 11 6.896 10.827 7.127 10.48C7.243 10.305 7.368 10.079 7.501 9.801C7.584 9.629 7.703 9.362 7.859 9C8.118 8.399 8.318 7.984 8.458 7.755C8.765 7.252 9.112 7 9.5 7C9.918 7 10.262 7.242 10.531 7.726C10.612 7.872 10.694 8.054 10.776 8.273C10.823 8.396 10.889 8.586 10.974 8.842C11.131 9.312 11.254 9.628 11.343 9.788C11.397 9.885 11.446 9.951 11.49 9.988C11.496 9.994 11.501 9.997 11.505 10C11.535 9.997 11.574 9.971 11.622 9.921C11.67 9.87 11.727 9.796 11.794 9.699C11.927 9.503 12.097 9.213 12.304 8.827C12.461 8.535 12.582 8.316 12.668 8.169C12.817 7.914 12.96 7.696 13.097 7.513C13.479 7.004 13.894 6.675 14.342 6.526C14.473 6.482 14.6 6.491 14.724 6.553C14.847 6.615 14.931 6.711 14.974 6.842C15.018 6.973 15.009 7.1 14.947 7.224C14.885 7.347 14.789 7.431 14.658 7.474C14.408 7.558 14.154 7.771 13.896 8.114C13.723 8.345 13.486 8.74 13.185 9.3C12.908 9.817 12.694 10.174 12.545 10.371C12.225 10.79 11.877 11 11.5 11C11.082 11 10.738 10.758 10.469 10.274C10.388 10.128 10.306 9.946 10.224 9.727C10.177 9.604 10.111 9.414 10.026 9.158C9.869 8.688 9.746 8.372 9.657 8.212C9.604 8.117 9.556 8.051 9.512 8.013L9.51 8.015C9.453 8.066 9.386 8.153 9.311 8.276C9.196 8.465 9.018 8.838 8.778 9.396C8.616 9.77 8.491 10.05 8.403 10.234C8.25 10.553 8.102 10.821 7.959 11.035C7.53 11.678 7.044 12 6.5 12C5.97 12 5.469 11.68 4.996 11.039C4.733 10.683 4.487 10.241 4.256 9.712C4.12 9.847 3.98 9.983 3.837 10.12C3.184 10.743 2.509 11.333 1.812 11.89C1.702 11.978 1.58 12.015 1.444 12C1.309 11.985 1.198 11.922 1.11 11.812C1.023 11.705 0.988 11.582 1.003 11.445C1.018 11.308 1.08 11.196 1.188 11.11C1.862 10.57 2.515 9.999 3.147 9.396C3.397 9.158 3.636 8.921 3.864 8.687ZM6.47 5.294C6.823 4.61 7 4.012 7 3.5C7 3.309 6.965 3.125 6.895 2.948C6.818 2.755 6.707 2.586 6.561 2.439C6.414 2.293 6.245 2.182 6.052 2.105C5.875 2.035 5.691 2 5.5 2C5.309 2 5.125 2.035 4.948 2.105C4.755 2.182 4.586 2.293 4.439 2.439C4.293 2.586 4.182 2.755 4.105 2.948C4.035 3.125 4 3.309 4 3.5C4 4.33 4.083 5.21 4.25 6.138C4.357 6.735 4.49 7.303 4.648 7.843C4.787 7.684 4.922 7.526 5.052 7.369C5.668 6.624 6.14 5.932 6.47 5.294ZM1 14.5C1 14.359 1.048 14.241 1.144 14.144C1.241 14.048 1.359 14 1.5 14L14.5 14C14.641 14 14.759 14.048 14.856 14.144C14.952 14.241 15 14.359 15 14.5C15 14.641 14.952 14.759 14.856 14.856C14.759 14.952 14.641 15 14.5 15L1.5 15C1.359 15 1.241 14.952 1.144 14.856C1.048 14.759 1 14.641 1 14.5Z"/></svg>

React

// Gentleface "signature" (line-round), MIT. https://gentleface.com/icons/signature
import type { SVGProps } from 'react';

export function SignatureIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M3.864 8.687C3.616 7.948 3.417 7.157 3.266 6.315C3.089 5.328 3 4.39 3 3.5C3 3.182 3.059 2.875 3.176 2.58C3.303 2.259 3.488 1.976 3.732 1.732C3.976 1.488 4.259 1.303 4.58 1.176C4.875 1.059 5.182 1 5.5 1C5.818 1 6.125 1.059 6.42 1.176C6.741 1.303 7.024 1.488 7.268 1.732C7.512 1.976 7.697 2.259 7.824 2.58C7.941 2.875 8 3.182 8 3.5C8 4.747 7.274 6.249 5.823 8.006C5.571 8.31 5.302 8.618 5.014 8.928C5.261 9.563 5.523 10.069 5.801 10.445C5.949 10.646 6.091 10.795 6.228 10.891C6.332 10.964 6.422 11 6.5 11C6.687 11 6.896 10.827 7.127 10.48C7.243 10.305 7.368 10.079 7.501 9.801C7.584 9.629 7.703 9.362 7.859 9C8.118 8.399 8.318 7.984 8.458 7.755C8.765 7.252 9.112 7 9.5 7C9.918 7 10.262 7.242 10.531 7.726C10.612 7.872 10.694 8.054 10.776 8.273C10.823 8.396 10.889 8.586 10.974 8.842C11.131 9.312 11.254 9.628 11.343 9.788C11.397 9.885 11.446 9.951 11.49 9.988C11.496 9.994 11.501 9.997 11.505 10C11.535 9.997 11.574 9.971 11.622 9.921C11.67 9.87 11.727 9.796 11.794 9.699C11.927 9.503 12.097 9.213 12.304 8.827C12.461 8.535 12.582 8.316 12.668 8.169C12.817 7.914 12.96 7.696 13.097 7.513C13.479 7.004 13.894 6.675 14.342 6.526C14.473 6.482 14.6 6.491 14.724 6.553C14.847 6.615 14.931 6.711 14.974 6.842C15.018 6.973 15.009 7.1 14.947 7.224C14.885 7.347 14.789 7.431 14.658 7.474C14.408 7.558 14.154 7.771 13.896 8.114C13.723 8.345 13.486 8.74 13.185 9.3C12.908 9.817 12.694 10.174 12.545 10.371C12.225 10.79 11.877 11 11.5 11C11.082 11 10.738 10.758 10.469 10.274C10.388 10.128 10.306 9.946 10.224 9.727C10.177 9.604 10.111 9.414 10.026 9.158C9.869 8.688 9.746 8.372 9.657 8.212C9.604 8.117 9.556 8.051 9.512 8.013L9.51 8.015C9.453 8.066 9.386 8.153 9.311 8.276C9.196 8.465 9.018 8.838 8.778 9.396C8.616 9.77 8.491 10.05 8.403 10.234C8.25 10.553 8.102 10.821 7.959 11.035C7.53 11.678 7.044 12 6.5 12C5.97 12 5.469 11.68 4.996 11.039C4.733 10.683 4.487 10.241 4.256 9.712C4.12 9.847 3.98 9.983 3.837 10.12C3.184 10.743 2.509 11.333 1.812 11.89C1.702 11.978 1.58 12.015 1.444 12C1.309 11.985 1.198 11.922 1.11 11.812C1.023 11.705 0.988 11.582 1.003 11.445C1.018 11.308 1.08 11.196 1.188 11.11C1.862 10.57 2.515 9.999 3.147 9.396C3.397 9.158 3.636 8.921 3.864 8.687ZM6.47 5.294C6.823 4.61 7 4.012 7 3.5C7 3.309 6.965 3.125 6.895 2.948C6.818 2.755 6.707 2.586 6.561 2.439C6.414 2.293 6.245 2.182 6.052 2.105C5.875 2.035 5.691 2 5.5 2C5.309 2 5.125 2.035 4.948 2.105C4.755 2.182 4.586 2.293 4.439 2.439C4.293 2.586 4.182 2.755 4.105 2.948C4.035 3.125 4 3.309 4 3.5C4 4.33 4.083 5.21 4.25 6.138C4.357 6.735 4.49 7.303 4.648 7.843C4.787 7.684 4.922 7.526 5.052 7.369C5.668 6.624 6.14 5.932 6.47 5.294ZM1 14.5C1 14.359 1.048 14.241 1.144 14.144C1.241 14.048 1.359 14 1.5 14L14.5 14C14.641 14 14.759 14.048 14.856 14.144C14.952 14.241 15 14.359 15 14.5C15 14.641 14.952 14.759 14.856 14.856C14.759 14.952 14.641 15 14.5 15L1.5 15C1.359 15 1.241 14.952 1.144 14.856C1.048 14.759 1 14.641 1 14.5Z" />
    </svg>
  );
}

Vue

Vue: see /icons/signature.md

Svelte

Svelte: see /icons/signature.md

HTML img

HTML img: see /icons/signature.md

CSS

CSS: see /icons/signature.md

Data URL

Data URL: see /icons/signature.md

Sprite

Sprite: see /icons/signature.md

SwiftUI

SwiftUI: see /icons/signature.md

Compose

Compose: see /icons/signature.md

Android XML

Android XML: see /icons/signature.md

Flutter

Flutter: see /icons/signature.md

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

Meaning

Use it for

signature, sign, signing

Alternatives

file-signature: sign a document (e-signature)

Also fits

write: sign a document
doodle: sign a document or form
sign document: a signature field or drawing a signature (sign)

Not for

rename (use pencil-line): signature means sign, not rename

Tags

signature, sign, autograph, handwriting, approve, contract

Category

Design

Component name

SignatureIcon

History

2026-10-14 added

More design icons

align-objects-bottom align-objects-bottom-three align-objects-left align-objects-left-three align-objects-right align-objects-right-three align-objects-top align-objects-top-three angle animation animation-off bezier-curve boolean-exclude boolean-intersect boolean-union bounding-box · all design icons

For agents

Metadata: /icons/signature.json · Markdown: /icons/signature.md · SVG: https://gentleface.com/svg/{style}/16/signature.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/signature.png

signature icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp

Code line-round

Meaning

More design icons

For agents

signature icon