The Phosphor handbag icon depicts a simple handbag and is commonly used to represent e-commerce, shopping carts, or personal accessories in user interfaces.
Common uses
- Add to cart button
- User profile/account section
- Online store navigation
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { Handbag } from '@phosphor-icons/react';
<Handbag size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<Handbag size={24} />thin
<Handbag size={24} weight="thin" />light
<Handbag size={24} weight="light" />bold
<Handbag size={24} weight="bold" />fill
<Handbag size={24} weight="fill" />duotone
<Handbag size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- commerce
- Keywords
- suitcasesvalisesbaggagepursescommerceobjectshandbagpursebagshopping bagclutch
FAQ
- What does the handbag icon represent?
- It represents a handbag, often used for e-commerce, shopping, or personal items in UI designs.
- How do I use the handbag icon in React?
- You can import and use it like this: import { Handbag } from '@phosphor-icons/react'; <Handbag />
- What is the license for this icon?
- The Phosphor icon library, including the handbag icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Phosphor.
Looking for something else? Search Phosphor and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →