Home/Libraries/Arcticons (Iconify)/chip

Arcticons (Iconify)

Chip

License: CC-BY-SA-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 48 48"><path fill="none" stroke="#818cf8" stroke-linecap="round" stroke-linejoin="round" d="M35.5 4.5h-23a4 4 0 0 0-4 4v31a4 4 0 0 0 4 4h23a4 4 0 0 0 4-4v-31a4 4 0 0 0-4-4M18.115 8.501h5.705c.165 0 .298.134.298.298v4.095c0 .078-.03.153-.085.209l-2.838 2.878a.3.3 0 0 1-.423.003l-.003-.003l-2.837-2.878a.3.3 0 0 1-.086-.21V8.8a.3.3 0 0 1 .27-.298Zm-5.621 5.622h4.123c.079 0 .155.03.21.085l2.877 2.838a.3.3 0 0 1 .003.422l-.003.003l-2.876 2.838a.3.3 0 0 1-.211.086h-4.094a.3.3 0 0 1-.298-.298V14.42a.3.3 0 0 1 .269-.299Zm12.822 0h4.123c.165 0 .298.133.298.298v5.676a.3.3 0 0 1-.298.298h-4.094a.3.3 0 0 1-.21-.085l-2.877-2.838a.3.3 0 0 1-.003-.423l.003-.003l2.878-2.838a.3.3 0 0 1 .18-.085m-4.338 4.323a.3.3 0 0 1 .216.089l2.838 2.878c.055.056.086.13.086.21v4.093a.3.3 0 0 1-.299.298h-5.675a.3.3 0 0 1-.299-.298v-4.094c0-.078.031-.153.086-.209l2.838-2.878a.3.3 0 0 1 .209-.09Zm10.67 9.726a4.292 4.292 0 0 1 .948 8.436q0 0 0 0a4.29 4.29 0 0 1-5.258-3.034v-.002a4.292 4.292 0 0 1 4.31-5.4m-10.25 2.746a4.292 4.292 0 1 1-4.31 5.401q0 0 0 0a4.29 4.29 0 0 1 3.034-5.257h.001c.415-.112.845-.16 1.275-.144"/></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. ChipIcon.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-SA-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.

Related Icons in Arcticons (Iconify)

Browse all Arcticons (Iconify) icons →

100