gentleface

Gentleface › Files & folders › file-pin

file-pin icon

File pin: pinned file, pin file, pinned document. 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.14 2.264C3.242 2.007 3.391 1.781 3.586 1.586C3.781 1.391 4.007 1.242 4.264 1.14C4.5 1.047 4.746 1 5 1L7.5 1C7.886 1 8.258 1.074 8.615 1.222C8.972 1.37 9.287 1.58 9.561 1.854L12.146 4.439C12.513 4.806 12.764 5.24 12.899 5.74C12.936 5.876 12.92 6.003 12.853 6.121C12.785 6.239 12.683 6.317 12.547 6.353C12.527 6.359 12.507 6.363 12.487 6.366L12.414 6.292L12.414 6.292L12.061 5.939C11.475 5.354 10.525 5.354 9.939 5.939L9.882 5.997C9.67 5.984 9.464 5.939 9.264 5.86C9.007 5.758 8.781 5.609 8.586 5.414C8.391 5.219 8.242 4.993 8.14 4.736C8.047 4.5 8 4.254 8 4L8 2.066C7.838 2.022 7.671 2 7.5 2L5 2C4.724 2 4.488 2.098 4.293 2.293C4.098 2.488 4 2.724 4 3L4 13C4 13.209 4.06 13.4 4.179 13.571C4.299 13.743 4.457 13.865 4.653 13.938C4.785 13.987 4.88 14.073 4.937 14.197C4.993 14.32 4.997 14.448 4.949 14.58C4.901 14.71 4.814 14.803 4.689 14.861C4.563 14.919 4.436 14.924 4.306 14.876C3.914 14.731 3.598 14.486 3.359 14.143C3.12 13.799 3 13.418 3 13L3 3C3 2.746 3.047 2.5 3.14 2.264ZM9 2.707L9 4C9 4.276 9.098 4.512 9.293 4.707C9.488 4.902 9.724 5 10 5L11.293 5L9 2.707ZM9.793 10C9.931 10 10.049 9.951 10.146 9.854L10.646 9.354C10.744 9.256 10.793 9.138 10.793 9C10.793 8.862 10.744 8.744 10.646 8.646L10.354 8.354C10.254 8.254 10.204 8.136 10.204 8C10.204 7.864 10.254 7.746 10.354 7.646L10.646 7.354C10.746 7.254 10.864 7.204 11 7.204C11.136 7.204 11.254 7.254 11.354 7.354L14.646 10.646C14.746 10.746 14.796 10.864 14.796 11C14.796 11.136 14.746 11.254 14.646 11.354L14.354 11.646C14.254 11.746 14.136 11.796 14 11.796C13.864 11.796 13.746 11.746 13.646 11.646L13.354 11.354C13.256 11.256 13.138 11.207 13 11.207C12.862 11.207 12.744 11.256 12.646 11.354L12.146 11.854C12.049 11.951 12 12.069 12 12.207L12 12.914C12 13.033 11.953 13.147 11.868 13.232C11.692 13.408 11.408 13.408 11.232 13.232L8.768 10.768C8.684 10.684 8.636 10.569 8.636 10.45C8.636 10.201 8.838 10 9.086 10L9.793 10ZM7.146 14.854C7.047 14.754 6.997 14.636 6.997 14.5C6.997 14.364 7.047 14.246 7.146 14.146L9.146 12.146C9.246 12.047 9.364 11.997 9.5 11.997C9.636 11.997 9.754 12.047 9.854 12.146C9.953 12.246 10.003 12.364 10.003 12.5C10.003 12.636 9.953 12.754 9.854 12.854L7.854 14.854C7.756 14.951 7.638 15 7.5 15C7.362 15 7.244 14.951 7.146 14.854Z"/></svg>
React
// Gentleface "file-pin" (line-round), MIT. https://gentleface.com/icons/file-pin
import type { SVGProps } from 'react';

export function FilePinIcon(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.14 2.264C3.242 2.007 3.391 1.781 3.586 1.586C3.781 1.391 4.007 1.242 4.264 1.14C4.5 1.047 4.746 1 5 1L7.5 1C7.886 1 8.258 1.074 8.615 1.222C8.972 1.37 9.287 1.58 9.561 1.854L12.146 4.439C12.513 4.806 12.764 5.24 12.899 5.74C12.936 5.876 12.92 6.003 12.853 6.121C12.785 6.239 12.683 6.317 12.547 6.353C12.527 6.359 12.507 6.363 12.487 6.366L12.414 6.292L12.414 6.292L12.061 5.939C11.475 5.354 10.525 5.354 9.939 5.939L9.882 5.997C9.67 5.984 9.464 5.939 9.264 5.86C9.007 5.758 8.781 5.609 8.586 5.414C8.391 5.219 8.242 4.993 8.14 4.736C8.047 4.5 8 4.254 8 4L8 2.066C7.838 2.022 7.671 2 7.5 2L5 2C4.724 2 4.488 2.098 4.293 2.293C4.098 2.488 4 2.724 4 3L4 13C4 13.209 4.06 13.4 4.179 13.571C4.299 13.743 4.457 13.865 4.653 13.938C4.785 13.987 4.88 14.073 4.937 14.197C4.993 14.32 4.997 14.448 4.949 14.58C4.901 14.71 4.814 14.803 4.689 14.861C4.563 14.919 4.436 14.924 4.306 14.876C3.914 14.731 3.598 14.486 3.359 14.143C3.12 13.799 3 13.418 3 13L3 3C3 2.746 3.047 2.5 3.14 2.264ZM9 2.707L9 4C9 4.276 9.098 4.512 9.293 4.707C9.488 4.902 9.724 5 10 5L11.293 5L9 2.707ZM9.793 10C9.931 10 10.049 9.951 10.146 9.854L10.646 9.354C10.744 9.256 10.793 9.138 10.793 9C10.793 8.862 10.744 8.744 10.646 8.646L10.354 8.354C10.254 8.254 10.204 8.136 10.204 8C10.204 7.864 10.254 7.746 10.354 7.646L10.646 7.354C10.746 7.254 10.864 7.204 11 7.204C11.136 7.204 11.254 7.254 11.354 7.354L14.646 10.646C14.746 10.746 14.796 10.864 14.796 11C14.796 11.136 14.746 11.254 14.646 11.354L14.354 11.646C14.254 11.746 14.136 11.796 14 11.796C13.864 11.796 13.746 11.746 13.646 11.646L13.354 11.354C13.256 11.256 13.138 11.207 13 11.207C12.862 11.207 12.744 11.256 12.646 11.354L12.146 11.854C12.049 11.951 12 12.069 12 12.207L12 12.914C12 13.033 11.953 13.147 11.868 13.232C11.692 13.408 11.408 13.408 11.232 13.232L8.768 10.768C8.684 10.684 8.636 10.569 8.636 10.45C8.636 10.201 8.838 10 9.086 10L9.793 10ZM7.146 14.854C7.047 14.754 6.997 14.636 6.997 14.5C6.997 14.364 7.047 14.246 7.146 14.146L9.146 12.146C9.246 12.047 9.364 11.997 9.5 11.997C9.636 11.997 9.754 12.047 9.854 12.146C9.953 12.246 10.003 12.364 10.003 12.5C10.003 12.636 9.953 12.754 9.854 12.854L7.854 14.854C7.756 14.951 7.638 15 7.5 15C7.362 15 7.244 14.951 7.146 14.854Z" />
    </svg>
  );
}
Vue
Vue: see /icons/file-pin.md
Svelte
Svelte: see /icons/file-pin.md
HTML img
HTML img: see /icons/file-pin.md
CSS
CSS: see /icons/file-pin.md
Data URL
Data URL: see /icons/file-pin.md
Sprite
Sprite: see /icons/file-pin.md
SwiftUI
SwiftUI: see /icons/file-pin.md
Compose
Compose: see /icons/file-pin.md
Android XML
Android XML: see /icons/file-pin.md
Flutter
Flutter: see /icons/file-pin.md

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too. 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
pinned file, pin file, pinned document
Tags
document, page, file, pin, pinned, pushpin, keep
Category
Files & folders
Component name
FilePinIcon
History
  • 20 px drawn, 24 px drawn, added

Family 84

More files & folders icons

For agents

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