basket icon

basket from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name: basket
Set: IonIcons
Style: Regular
Viewbox: 512×512
License: MIT

2 other variants in IonIcons

The same icon in other sets

basketAkar Icons basketBootstrap Icons basketBoxIcons v2 basketBoxIcons v2 Solid basketFluent Emoji basketFluent Emoji Flat basketFluent Emoji High Contrast basketHumbleicons 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 512 512"><path fill="currentColor" d="M424.11 192H360L268.8 70.4a16 16 0 0 0-25.6 0L152 192H87.89a32.57 32.57 0 0 0-32.62 32.44a30.3 30.3 0 0 0 1.31 9l46.27 163.14a50.72 50.72 0 0 0 48.84 36.91h208.62a51.21 51.21 0 0 0 49-36.86l46.33-163.36a15.6 15.6 0 0 0 .46-2.36l.53-4.93a13 13 0 0 0 .09-1.55A32.57 32.57 0 0 0 424.11 192M256 106.67L320 192H192Zm0 245a37.7 37.7 0 1 1 37.88-37.7A37.87 37.87 0 0 1 256 351.63Z"/></svg>

React

import type { SVGProps } from "react";

export function IonBasket(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M424.11 192H360L268.8 70.4a16 16 0 0 0-25.6 0L152 192H87.89a32.57 32.57 0 0 0-32.62 32.44a30.3 30.3 0 0 0 1.31 9l46.27 163.14a50.72 50.72 0 0 0 48.84 36.91h208.62a51.21 51.21 0 0 0 49-36.86l46.33-163.36a15.6 15.6 0 0 0 .46-2.36l.53-4.93a13 13 0 0 0 .09-1.55A32.57 32.57 0 0 0 424.11 192M256 106.67L320 192H192Zm0 245a37.7 37.7 0 1 1 37.88-37.7A37.87 37.87 0 0 1 256 351.63Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M424.11 192H360L268.8 70.4a16 16 0 0 0-25.6 0L152 192H87.89a32.57 32.57 0 0 0-32.62 32.44a30.3 30.3 0 0 0 1.31 9l46.27 163.14a50.72 50.72 0 0 0 48.84 36.91h208.62a51.21 51.21 0 0 0 49-36.86l46.33-163.36a15.6 15.6 0 0 0 .46-2.36l.53-4.93a13 13 0 0 0 .09-1.55A32.57 32.57 0 0 0 424.11 192M256 106.67L320 192H192Zm0 245a37.7 37.7 0 1 1 37.88-37.7A37.87 37.87 0 0 1 256 351.63Z"/></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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M424.11%20192H360L268.8%2070.4a16%2016%200%200%200-25.6%200L152%20192H87.89a32.57%2032.57%200%200%200-32.62%2032.44a30.3%2030.3%200%200%200%201.31%209l46.27%20163.14a50.72%2050.72%200%200%200%2048.84%2036.91h208.62a51.21%2051.21%200%200%200%2049-36.86l46.33-163.36a15.6%2015.6%200%200%200%20.46-2.36l.53-4.93a13%2013%200%200%200%20.09-1.55A32.57%2032.57%200%200%200%20424.11%20192M256%20106.67L320%20192H192Zm0%20245a37.7%2037.7%200%201%201%2037.88-37.7A37.87%2037.87%200%200%201%20256%20351.63Z%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M424.11%20192H360L268.8%2070.4a16%2016%200%200%200-25.6%200L152%20192H87.89a32.57%2032.57%200%200%200-32.62%2032.44a30.3%2030.3%200%200%200%201.31%209l46.27%20163.14a50.72%2050.72%200%200%200%2048.84%2036.91h208.62a51.21%2051.21%200%200%200%2049-36.86l46.33-163.36a15.6%2015.6%200%200%200%20.46-2.36l.53-4.93a13%2013%200%200%200%20.09-1.55A32.57%2032.57%200%200%200%20424.11%20192M256%20106.67L320%20192H192Zm0%20245a37.7%2037.7%200%201%201%2037.88-37.7A37.87%2037.87%200%200%201%20256%20351.63Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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