package-open icon

Package open: open package, unpack, unboxing. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Code line-round

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M1.222 4.407C1.309 4.145 1.477 3.953 1.724 3.829L4.829 2.276C5.076 2.153 5.331 2.135 5.593 2.222C5.855 2.309 6.047 2.477 6.171 2.724L7.5 5.382L8.829 2.724C8.953 2.477 9.145 2.309 9.407 2.222C9.669 2.135 9.924 2.153 10.171 2.276L13.276 3.829C13.523 3.953 13.691 4.145 13.778 4.407C13.865 4.669 13.847 4.924 13.724 5.171L12.394 7.829C12.131 8.355 12 8.912 12 9.5L12 12.191C12 12.38 11.95 12.556 11.851 12.717C11.751 12.878 11.617 13.001 11.447 13.085L8.618 14.5C8.266 14.676 7.893 14.764 7.5 14.764C7.107 14.764 6.734 14.676 6.382 14.5L3.553 13.085C3.383 13.001 3.249 12.878 3.149 12.717C3.05 12.556 3 12.38 3 12.191L3 9.5C3 8.912 2.869 8.355 2.606 7.829L1.276 5.171C1.153 4.924 1.135 4.669 1.222 4.407ZM6.382 6.5C6.535 6.424 6.691 6.364 6.851 6.321L5.276 3.171L2.171 4.724L3.5 7.382C3.575 7.533 3.642 7.686 3.701 7.841L6.382 6.5ZM11.5 7.382L12.829 4.724L9.724 3.171L8.149 6.321C8.309 6.364 8.465 6.424 8.618 6.5L11.299 7.841C11.358 7.686 11.425 7.533 11.5 7.382ZM6.829 9.606C7.04 9.711 7.264 9.764 7.5 9.764C7.736 9.764 7.96 9.711 8.171 9.606L10.382 8.5L8.171 7.394C7.96 7.289 7.736 7.236 7.5 7.236C7.264 7.236 7.04 7.289 6.829 7.394L4.618 8.5L6.829 9.606ZM6.829 13.606C6.885 13.634 6.942 13.658 7 13.679L7 10.714C6.787 10.671 6.581 10.6 6.382 10.5L3.996 9.307C3.999 9.371 4 9.435 4 9.5L4 12.191L6.829 13.606ZM8.171 13.606L11 12.191L11 9.5C11 9.435 11.001 9.371 11.004 9.307L8.618 10.5C8.419 10.6 8.213 10.671 8 10.714L8 13.679C8.058 13.658 8.115 13.634 8.171 13.606Z"/></svg>

React

// Gentleface "package-open" (line-round), MIT. https://gentleface.com/icons/package-open
import type { SVGProps } from 'react';

export function PackageOpenIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M1.222 4.407C1.309 4.145 1.477 3.953 1.724 3.829L4.829 2.276C5.076 2.153 5.331 2.135 5.593 2.222C5.855 2.309 6.047 2.477 6.171 2.724L7.5 5.382L8.829 2.724C8.953 2.477 9.145 2.309 9.407 2.222C9.669 2.135 9.924 2.153 10.171 2.276L13.276 3.829C13.523 3.953 13.691 4.145 13.778 4.407C13.865 4.669 13.847 4.924 13.724 5.171L12.394 7.829C12.131 8.355 12 8.912 12 9.5L12 12.191C12 12.38 11.95 12.556 11.851 12.717C11.751 12.878 11.617 13.001 11.447 13.085L8.618 14.5C8.266 14.676 7.893 14.764 7.5 14.764C7.107 14.764 6.734 14.676 6.382 14.5L3.553 13.085C3.383 13.001 3.249 12.878 3.149 12.717C3.05 12.556 3 12.38 3 12.191L3 9.5C3 8.912 2.869 8.355 2.606 7.829L1.276 5.171C1.153 4.924 1.135 4.669 1.222 4.407ZM6.382 6.5C6.535 6.424 6.691 6.364 6.851 6.321L5.276 3.171L2.171 4.724L3.5 7.382C3.575 7.533 3.642 7.686 3.701 7.841L6.382 6.5ZM11.5 7.382L12.829 4.724L9.724 3.171L8.149 6.321C8.309 6.364 8.465 6.424 8.618 6.5L11.299 7.841C11.358 7.686 11.425 7.533 11.5 7.382ZM6.829 9.606C7.04 9.711 7.264 9.764 7.5 9.764C7.736 9.764 7.96 9.711 8.171 9.606L10.382 8.5L8.171 7.394C7.96 7.289 7.736 7.236 7.5 7.236C7.264 7.236 7.04 7.289 6.829 7.394L4.618 8.5L6.829 9.606ZM6.829 13.606C6.885 13.634 6.942 13.658 7 13.679L7 10.714C6.787 10.671 6.581 10.6 6.382 10.5L3.996 9.307C3.999 9.371 4 9.435 4 9.5L4 12.191L6.829 13.606ZM8.171 13.606L11 12.191L11 9.5C11 9.435 11.001 9.371 11.004 9.307L8.618 10.5C8.419 10.6 8.213 10.671 8 10.714L8 13.679C8.058 13.658 8.115 13.634 8.171 13.606Z" />
    </svg>
  );
}

Vue

Vue: see /icons/package-open.md

Svelte

Svelte: see /icons/package-open.md

HTML img

HTML img: see /icons/package-open.md

CSS

CSS: see /icons/package-open.md

Data URL

Data URL: see /icons/package-open.md

Sprite

Sprite: see /icons/package-open.md

SwiftUI

SwiftUI: see /icons/package-open.md

Compose

Compose: see /icons/package-open.md

Android XML

Android XML: see /icons/package-open.md

Flutter

Flutter: see /icons/package-open.md

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

With npm: import { PackageOpenIcon } from '@gentleface/react'; (setup).

Meaning

Use it for

open package, unpack, unboxing

Don’t confuse with

archive-arrow-up: unarchive restores from an archive, not opening a parcel

Tags

package, open, opened, open-box, unbox, unboxing, unpack, parcel, carton, box, delivered, contents, shipment

Category

Shopping

Component name

PackageOpenIcon

History

2026-10-29 released in 0.2.0
2026-10-30 added

Since

version 0.2.0

Family 13

package package-alert package-arrow-down package-arrow-right package-arrow-up package-check package-clock package-off package-pencil package-plus package-search package-x

More shopping icons

arrows-up-from-line barcode cash-register dress gem gift gift-check handbag hanger locker pants perfume qr-code receipt receipt-alert receipt-arrow-right · all shopping icons

For agents

Metadata: /icons/package-open.json · Markdown: /icons/package-open.md · SVG: https://gentleface.com/svg/{style}/16/package-open.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/package-open.png

package-open icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp