shopping bag icon
shopping-bag-fill from Keyline Icons by Keyline Icons · Fill · MIT Free for personal and commercial use.
- Name
- shopping-bag-fill
- Set
- Keyline Icons
- Style
- Fill
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
The same icon in other sets
shopping-bagAkar Iconsshopping-bagBoxIcons v2shopping-bagBoxIcons v2 Solidshopping-bagCarbonshopping-bagElement Plusshopping-bag-fillEva Iconsshopping-bagFont Awesome Solidshopping-bagFeather Iconsshopping-bag-outlineFlowbite Iconsshopping-bag-16-filledFluent UI System Iconsshopping-bagcss.ggshopping-bagHeroIconsshopping-bagIconParkshopping-bagIconPark Outlineshopping-bagIconPark Solidshopping-bagIconPark TwoToneshopping-bagIconoirshopping-bagJam Iconsshopping-bagLine Awesomeshopping-bagLucideshopping-bagMage Iconsshopping-bagMajesticonsshopping-bagMaterial Symbolsshopping-bagMaterial Symbols Light
Related icons in Keyline Icons
Use the shopping bag icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M5.3 3.6C6.05542 2.59278 7.24097 2 8.5 2H15.5C16.759 2 17.9446 2.59278 18.7 3.6L20.6 6.13333C20.8596 6.47953 21 6.90059 21 7.33333V18C21 20.2091 19.2091 22 17 22H7C4.79086 22 3 20.2091 3 18V7.33333C3 6.90059 3.14036 6.47953 3.4 6.13333L5.3 3.6ZM8.5 4H15.5C16.1297 4 16.7222 4.2962 17.1 4.8L18 6H6L6.9 4.8C7.2778 4.2962 7.8703 4 8.5 4ZM16 11C16 13.2091 14.2091 15 12 15C9.79086 15 8 13.2091 8 11C8 10.4477 8.44771 10 9 10C9.55229 10 10 10.4477 10 11C10 12.1046 10.8954 13 12 13C13.1046 13 14 12.1046 14 11C14 10.4477 14.4477 10 15 10C15.5523 10 16 10.4477 16 11Z" clip-rule="evenodd"/></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsShoppingBagFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fillRule="evenodd" d="M5.3 3.6C6.05542 2.59278 7.24097 2 8.5 2H15.5C16.759 2 17.9446 2.59278 18.7 3.6L20.6 6.13333C20.8596 6.47953 21 6.90059 21 7.33333V18C21 20.2091 19.2091 22 17 22H7C4.79086 22 3 20.2091 3 18V7.33333C3 6.90059 3.14036 6.47953 3.4 6.13333L5.3 3.6ZM8.5 4H15.5C16.1297 4 16.7222 4.2962 17.1 4.8L18 6H6L6.9 4.8C7.2778 4.2962 7.8703 4 8.5 4ZM16 11C16 13.2091 14.2091 15 12 15C9.79086 15 8 13.2091 8 11C8 10.4477 8.44771 10 9 10C9.55229 10 10 10.4477 10 11C10 12.1046 10.8954 13 12 13C13.1046 13 14 12.1046 14 11C14 10.4477 14.4477 10 15 10C15.5523 10 16 10.4477 16 11Z" clipRule="evenodd"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M5.3 3.6C6.05542 2.59278 7.24097 2 8.5 2H15.5C16.759 2 17.9446 2.59278 18.7 3.6L20.6 6.13333C20.8596 6.47953 21 6.90059 21 7.33333V18C21 20.2091 19.2091 22 17 22H7C4.79086 22 3 20.2091 3 18V7.33333C3 6.90059 3.14036 6.47953 3.4 6.13333L5.3 3.6ZM8.5 4H15.5C16.1297 4 16.7222 4.2962 17.1 4.8L18 6H6L6.9 4.8C7.2778 4.2962 7.8703 4 8.5 4ZM16 11C16 13.2091 14.2091 15 12 15C9.79086 15 8 13.2091 8 11C8 10.4477 8.44771 10 9 10C9.55229 10 10 10.4477 10 11C10 12.1046 10.8954 13 12 13C13.1046 13 14 12.1046 14 11C14 10.4477 14.4477 10 15 10C15.5523 10 16 10.4477 16 11Z" clip-rule="evenodd"/></svg> </template>
CSS
.icon-shopping-bag-fill {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5.3%203.6C6.05542%202.59278%207.24097%202%208.5%202H15.5C16.759%202%2017.9446%202.59278%2018.7%203.6L20.6%206.13333C20.8596%206.47953%2021%206.90059%2021%207.33333V18C21%2020.2091%2019.2091%2022%2017%2022H7C4.79086%2022%203%2020.2091%203%2018V7.33333C3%206.90059%203.14036%206.47953%203.4%206.13333L5.3%203.6ZM8.5%204H15.5C16.1297%204%2016.7222%204.2962%2017.1%204.8L18%206H6L6.9%204.8C7.2778%204.2962%207.8703%204%208.5%204ZM16%2011C16%2013.2091%2014.2091%2015%2012%2015C9.79086%2015%208%2013.2091%208%2011C8%2010.4477%208.44771%2010%209%2010C9.55229%2010%2010%2010.4477%2010%2011C10%2012.1046%2010.8954%2013%2012%2013C13.1046%2013%2014%2012.1046%2014%2011C14%2010.4477%2014.4477%2010%2015%2010C15.5523%2010%2016%2010.4477%2016%2011Z%22%20clip-rule%3D%22evenodd%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5.3%203.6C6.05542%202.59278%207.24097%202%208.5%202H15.5C16.759%202%2017.9446%202.59278%2018.7%203.6L20.6%206.13333C20.8596%206.47953%2021%206.90059%2021%207.33333V18C21%2020.2091%2019.2091%2022%2017%2022H7C4.79086%2022%203%2020.2091%203%2018V7.33333C3%206.90059%203.14036%206.47953%203.4%206.13333L5.3%203.6ZM8.5%204H15.5C16.1297%204%2016.7222%204.2962%2017.1%204.8L18%206H6L6.9%204.8C7.2778%204.2962%207.8703%204%208.5%204ZM16%2011C16%2013.2091%2014.2091%2015%2012%2015C9.79086%2015%208%2013.2091%208%2011C8%2010.4477%208.44771%2010%209%2010C9.55229%2010%2010%2010.4477%2010%2011C10%2012.1046%2010.8954%2013%2012%2013C13.1046%2013%2014%2012.1046%2014%2011C14%2010.4477%2014.4477%2010%2015%2010C15.5523%2010%2016%2010.4477%2016%2011Z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/shopping-bag-fill.svg?color=%231a73e8&size=48
