gentleface

Gentleface › Shopping › handbag

handbag icon

Handbag: handbag, purse, tote. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

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="M10.897 8.5C11.089 8.668 11.244 8.87 11.362 9.106L12.862 12.106C13.006 12.393 13.076 12.698 13.073 13.02C13.069 13.391 12.97 13.735 12.774 14.051C12.579 14.368 12.316 14.61 11.985 14.78C11.699 14.927 11.395 15 11.073 15L3.927 15C3.605 15 3.301 14.927 3.015 14.78C2.684 14.61 2.421 14.368 2.226 14.051C2.03 13.735 1.931 13.391 1.927 13.02C1.924 12.698 1.994 12.393 2.138 12.106L3.638 9.106C3.756 8.87 3.911 8.668 4.103 8.5C4.036 8.419 4 8.318 4 8.214L4 6.5C4 6.055 4.082 5.625 4.246 5.212C4.424 4.762 4.683 4.367 5.025 4.025C5.367 3.683 5.762 3.424 6.212 3.246C6.625 3.082 7.055 3 7.5 3C7.945 3 8.375 3.082 8.788 3.246C9.238 3.424 9.633 3.683 9.975 4.025C10.317 4.367 10.576 4.762 10.754 5.212C10.918 5.625 11 6.055 11 6.5L11 8.214C11 8.318 10.964 8.419 10.897 8.5ZM9.824 5.58C9.697 5.259 9.512 4.976 9.268 4.732C9.024 4.488 8.741 4.303 8.42 4.176C8.125 4.059 7.818 4 7.5 4C7.182 4 6.875 4.059 6.58 4.176C6.259 4.303 5.976 4.488 5.732 4.732C5.488 4.976 5.303 5.259 5.176 5.58C5.059 5.875 5 6.182 5 6.5L5 8.045C5.138 8.015 5.28 8 5.427 8L9.573 8C9.72 8 9.862 8.015 10 8.045L10 6.5C10 6.182 9.941 5.875 9.824 5.58ZM2.927 13.01C2.929 13.196 2.979 13.368 3.076 13.526C3.174 13.684 3.306 13.805 3.471 13.89C3.614 13.963 3.766 14 3.927 14L11.073 14C11.234 14 11.386 13.963 11.529 13.89C11.694 13.805 11.826 13.684 11.924 13.526C12.021 13.368 12.071 13.196 12.073 13.01C12.074 12.849 12.039 12.697 11.967 12.553L10.467 9.553C10.383 9.383 10.26 9.249 10.099 9.149C9.938 9.05 9.762 9 9.573 9L5.427 9C5.238 9 5.062 9.05 4.901 9.149C4.74 9.249 4.617 9.383 4.533 9.553L3.033 12.553C2.961 12.697 2.926 12.849 2.927 13.01Z"/></svg>
React
// Gentleface "handbag" (line-round), MIT. https://gentleface.com/icons/handbag
import type { SVGProps } from 'react';

export function HandbagIcon(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="M10.897 8.5C11.089 8.668 11.244 8.87 11.362 9.106L12.862 12.106C13.006 12.393 13.076 12.698 13.073 13.02C13.069 13.391 12.97 13.735 12.774 14.051C12.579 14.368 12.316 14.61 11.985 14.78C11.699 14.927 11.395 15 11.073 15L3.927 15C3.605 15 3.301 14.927 3.015 14.78C2.684 14.61 2.421 14.368 2.226 14.051C2.03 13.735 1.931 13.391 1.927 13.02C1.924 12.698 1.994 12.393 2.138 12.106L3.638 9.106C3.756 8.87 3.911 8.668 4.103 8.5C4.036 8.419 4 8.318 4 8.214L4 6.5C4 6.055 4.082 5.625 4.246 5.212C4.424 4.762 4.683 4.367 5.025 4.025C5.367 3.683 5.762 3.424 6.212 3.246C6.625 3.082 7.055 3 7.5 3C7.945 3 8.375 3.082 8.788 3.246C9.238 3.424 9.633 3.683 9.975 4.025C10.317 4.367 10.576 4.762 10.754 5.212C10.918 5.625 11 6.055 11 6.5L11 8.214C11 8.318 10.964 8.419 10.897 8.5ZM9.824 5.58C9.697 5.259 9.512 4.976 9.268 4.732C9.024 4.488 8.741 4.303 8.42 4.176C8.125 4.059 7.818 4 7.5 4C7.182 4 6.875 4.059 6.58 4.176C6.259 4.303 5.976 4.488 5.732 4.732C5.488 4.976 5.303 5.259 5.176 5.58C5.059 5.875 5 6.182 5 6.5L5 8.045C5.138 8.015 5.28 8 5.427 8L9.573 8C9.72 8 9.862 8.015 10 8.045L10 6.5C10 6.182 9.941 5.875 9.824 5.58ZM2.927 13.01C2.929 13.196 2.979 13.368 3.076 13.526C3.174 13.684 3.306 13.805 3.471 13.89C3.614 13.963 3.766 14 3.927 14L11.073 14C11.234 14 11.386 13.963 11.529 13.89C11.694 13.805 11.826 13.684 11.924 13.526C12.021 13.368 12.071 13.196 12.073 13.01C12.074 12.849 12.039 12.697 11.967 12.553L10.467 9.553C10.383 9.383 10.26 9.249 10.099 9.149C9.938 9.05 9.762 9 9.573 9L5.427 9C5.238 9 5.062 9.05 4.901 9.149C4.74 9.249 4.617 9.383 4.533 9.553L3.033 12.553C2.961 12.697 2.926 12.849 2.927 13.01Z" />
    </svg>
  );
}
Vue
Vue: see /icons/handbag.md
Svelte
Svelte: see /icons/handbag.md
HTML img
HTML img: see /icons/handbag.md
CSS
CSS: see /icons/handbag.md
Data URL
Data URL: see /icons/handbag.md
Sprite
Sprite: see /icons/handbag.md
SwiftUI
SwiftUI: see /icons/handbag.md
Compose
Compose: see /icons/handbag.md
Android XML
Android XML: see /icons/handbag.md
Flutter
Flutter: see /icons/handbag.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
handbag, purse, tote
Alternatives
Not for
  • shopping bag (use shopping-bag): a fashion item, not the shopping bag
  • wallet (use wallet): a fashion bag or purse
Tags
handbag, purse, bag, fashion, accessory, tote, clutch
Category
Shopping
Component name
HandbagIcon
History
  • added

More shopping icons

barcode cash-register gem gift gift-check hanger package package-alert package-arrow-down package-arrow-right package-arrow-up package-check package-clock package-off package-pencil package-plus · all shopping icons

For agents

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

Feedback