basket icon

basket from Bootstrap Icons by The Bootstrap Authors · Outline · MIT Free for personal and commercial use.

Name: basket
Set: Bootstrap Icons
Style: Outline
Viewbox: 16×16
License: MIT

1 other variant in Bootstrap Icons

The same icon in other sets

basketAkar Icons basketBoxIcons v2 basketBoxIcons v2 Solid basketFluent Emoji basketFluent Emoji Flat basketFluent Emoji High Contrast basketHumbleicons basketIonIcons basketMage Icons basketMaterial Design Icons basket-fillMingCute Icon basketNoto Emoji basketOpenMoji basketPhosphor basketTabler Icons basket-outlineTeenyicons basketTwitter Emoji

Use the basket icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M5.757 1.071a.5.5 0 0 1 .172.686L3.383 6h9.234L10.07 1.757a.5.5 0 1 1 .858-.514L13.783 6H15a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1v4.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 13.5V9a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h1.217L5.07 1.243a.5.5 0 0 1 .686-.172zM2 9v4.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V9zM1 7v1h14V7zm3 3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 4 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 6 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 8 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5"/></svg>

React

import type { SVGProps } from "react";

export function BiBasket(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M5.757 1.071a.5.5 0 0 1 .172.686L3.383 6h9.234L10.07 1.757a.5.5 0 1 1 .858-.514L13.783 6H15a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1v4.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 13.5V9a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h1.217L5.07 1.243a.5.5 0 0 1 .686-.172zM2 9v4.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V9zM1 7v1h14V7zm3 3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 4 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 6 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 8 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M5.757 1.071a.5.5 0 0 1 .172.686L3.383 6h9.234L10.07 1.757a.5.5 0 1 1 .858-.514L13.783 6H15a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1v4.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 13.5V9a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h1.217L5.07 1.243a.5.5 0 0 1 .686-.172zM2 9v4.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V9zM1 7v1h14V7zm3 3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 4 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 6 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3A.5.5 0 0 1 8 10m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5m2 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 .5-.5"/></svg>
</template>

CSS

.icon-basket {
  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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5.757%201.071a.5.5%200%200%201%20.172.686L3.383%206h9.234L10.07%201.757a.5.5%200%201%201%20.858-.514L13.783%206H15a1%201%200%200%201%201%201v1a1%201%200%200%201-1%201v4.5a2.5%202.5%200%200%201-2.5%202.5h-9A2.5%202.5%200%200%201%201%2013.5V9a1%201%200%200%201-1-1V7a1%201%200%200%201%201-1h1.217L5.07%201.243a.5.5%200%200%201%20.686-.172zM2%209v4.5A1.5%201.5%200%200%200%203.5%2015h9a1.5%201.5%200%200%200%201.5-1.5V9zM1%207v1h14V7zm3%203a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%204%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%206%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%208%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3a.5.5%200%200%201%20.5-.5m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3a.5.5%200%200%201%20.5-.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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5.757%201.071a.5.5%200%200%201%20.172.686L3.383%206h9.234L10.07%201.757a.5.5%200%201%201%20.858-.514L13.783%206H15a1%201%200%200%201%201%201v1a1%201%200%200%201-1%201v4.5a2.5%202.5%200%200%201-2.5%202.5h-9A2.5%202.5%200%200%201%201%2013.5V9a1%201%200%200%201-1-1V7a1%201%200%200%201%201-1h1.217L5.07%201.243a.5.5%200%200%201%20.686-.172zM2%209v4.5A1.5%201.5%200%200%200%203.5%2015h9a1.5%201.5%200%200%200%201.5-1.5V9zM1%207v1h14V7zm3%203a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%204%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%206%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3A.5.5%200%200%201%208%2010m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3a.5.5%200%200%201%20.5-.5m2%200a.5.5%200%200%201%20.5.5v3a.5.5%200%200%201-1%200v-3a.5.5%200%200%201%20.5-.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bi/basket.svg?color=%231a73e8&size=48