Home/Libraries/Freehand free icons (Iconify)/shop-cart

Freehand free icons (Iconify)

ShopCart

License: CC-BY-4.0

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24"><g fill="#818cf8" fill-rule="evenodd" clip-rule="evenodd"><path d="M12.382 9.197a2.468 2.468 0 0 0 3.857-1.44a3 3 0 0 0 3.817.6a5.5 5.5 0 0 0 .1 3.218a.302.302 0 0 0 .6-.06a8.7 8.7 0 0 0 .1-3.807c1.109-1.33.57-3.058 0-4.567A5.4 5.4 0 0 0 18.747.433c-.869-.68-12.64-.44-15.019-.09a.34.34 0 1 0 .1.67c.64-.08 1.589-.14 2.668-.17a15 15 0 0 0-.87 3.787a10 10 0 0 1-3.377.28a5 5 0 0 0-.8.08a24 24 0 0 1 1.47-3.618a.31.31 0 0 0-.57-.21a13 13 0 0 0-1 2.059c-2.667 5.566 2.2 7.075 4.178 4.397c.63 1 .91 1.699 2.168 1.868a3.4 3.4 0 0 0 2.289-.56a3.2 3.2 0 0 0 1.089-1.158a3.7 3.7 0 0 0 1.309 1.429m5.816-7.995a4.37 4.37 0 0 1 1.699 2.239c.497.976.61 2.102.32 3.158a1.938 1.938 0 0 1-2.939.55c-1.159-1.38-.999-1.37-.949-1.68c.66 0 1.33-.08 1.999-.09a.34.34 0 1 0 0-.68l-1.999-.06a17.7 17.7 0 0 0-.61-3.646c.81 0 1.48.1 2 .16c.199.03.429.17.479.1zM14.98.992a23 23 0 0 0 .24 3.718l-3.627-.1c.1-1.244.1-2.494 0-3.737c1.209-.01 2.388.03 3.387.12M7.236.823h3.657c-.24 1.216-.37 2.45-.39 3.688a18.5 18.5 0 0 0-3.727-.1c.21-.83.46-3.587.46-3.587M4.817 7.099a2.09 2.09 0 0 1-2.468.89c-1-.38-1.13-1.31-1-2.339q.45-.045.9 0a10 10 0 0 0 3.348 0c-.02.56-.5.97-.78 1.45m4.557.89c-.77.54-1.999.68-2.478-.11a4.2 4.2 0 0 1-.37-2.409a25 25 0 0 1 4.057.14A3.18 3.18 0 0 1 9.374 7.99m2.069-2.359c1.299 0 2.288 0 3.997-.11c.18.83-.37 2.798-1.29 2.938a2.2 2.2 0 0 1-1.998-1.209a7.3 7.3 0 0 1-.71-1.579zM23.434 17.84a.86.86 0 0 0-.78-.46c-.27-2.128-.51-3.886-2.458-3.547c0-.939-.62-1.059-1.549-1.099c-2.908 0-3.577.05-4.077.9a2.21 2.21 0 0 0-2.378 1.838a6 6 0 0 0-.15 1.999a.34.34 0 0 0 .11.67h1.939c.05.379.13.919.2 1.638q-1.102-.024-2.199.08q-.196-.736-.49-1.439a.32.32 0 0 0-.37 0c-.25.17-.17.14.87 3.997c.05.428.196.838.43 1.2c.45.469 1.689.34 2.208.35q2.566.094 5.126-.08c.61-.05 2.059.279 2.459-.52c.463-1.111.799-2.271.999-3.458c.09-.59.48-1.359.11-2.068m-7.874-4.237q1.791.232 3.597.24a6 6 0 0 1-.09.65s-3.557.1-3.757 0s-.21-.09-.22-.18a.71.71 0 0 1 .47-.71m-2.878 3.798q.22-.727.53-1.42c.549-1.398.249-1.138 1.148-1.588a1 1 0 0 0 .6.87c.533.2 1.1.295 1.669.28c1.998.14 3.327.489 3.507-1q.167.01.33.05c.08 0 .73-.06 1.409 2.628a69 69 0 0 0-9.193.18m5.436.67q-.135.848-.14 1.708c-1.2-.09-1.5 0-2.548-.05l-.18-.62c-.49-1.099-.43-.909-.45-.999c1.35-.05 2.108-.07 3.318-.04m4.067 1.548c-.18.67-.29 1.36-.46 1.999c-.48 1.818 0 .91-1.999 1.099c-2.208.21-4.426.3-6.645.27l-.81-2.498q1.078.042 2.14.23q.224.93.629 1.798c.58.53.53-1.599.52-1.679q1.213.069 2.428 0c.06.55.08 1.73.61 1.56c.529-.17.27-.26.419-1.57a6.5 6.5 0 0 0 2.069-.19a.34.34 0 0 0 0-.679a4.7 4.7 0 0 1-1.999-.06c0-.57-.07-.14-.14-1.799q1.771.1 3.518.4q-.097.57-.28 1.12M5.717 15.912c.67 0 .59-1.739.06-1.739c-.91.01-.57 1.739-.06 1.739m2.408-3.667c.1.22.31 2.328.45 3.837s.679 1.319.839 0c0-.91.07-1.889.07-1.939a6.3 6.3 0 0 0-.41-2.518a.83.83 0 0 0-.43-.35a28 28 0 0 0-4.466-.12c-.26.07-.44.36-.16.6c.08.07 3.777.51 4.107.49m-4.727 3.837c.32.75.66.71 1 0c0-.46 0-.89.06-1v-.999c-.29-1.998-.19-1.828-.42-1.938a.3.3 0 0 0-.41.24a17 17 0 0 0-.27 2.997c-.04.15 0 .42.04.7"/><path d="M9.744 17.66c-.62 0-6.636-.33-7.715-.43a3.4 3.4 0 0 0-.55 0c-.18-7.464-.21-1.148-.23-8.723a.3.3 0 0 0-.599 0a66 66 0 0 0-.16 8.914c.06.51.22.79.71.87a79 79 0 0 0 8.544.05a.34.34 0 1 0 0-.68"/></g></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. ShopCartIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.