package icon

package from Codicons by Microsoft Corporation · Regular · CC-BY-4.0 Attribution required.

Name
package
Set
Codicons
Style
Regular
Viewbox
16×16
License
CC BY 4.0

The same icon in other sets

packageBoxIcons v2packageBoxIcons v2 SolidpackageCarbonpackageEmoji One (Colored)packageFeather IconspackageFluent EmojipackageFluent Emoji FlatpackageFluent Emoji High ContrastpackageFirefox OS EmojipackageHuge IconspackageHumbleiconspackageIconoirpackageLucidepackageMaterial SymbolspackageMaterial Symbols LightpackageMaterial Design Iconspackage-fillMingCute IconpackageMyna UI IconspackageNoto EmojipackageOcticonspackageOpenMojipackagePhosphorpackagePixelarticonspackageStreamline Emojis

Use the package icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M6 8.64a.5.5 0 0 1-.197-.041l-2.5-1.07a.499.499 0 1 1 .393-.919l2.5 1.07A.499.499 0 0 1 6 8.639zm-1.196 1.53a.5.5 0 0 0 .656-.264a.5.5 0 0 0-.264-.656l-1.5-.64a.5.5 0 0 0-.392.92z"/><path fill-rule="evenodd" d="M14.039 3.286L9.077 1.378a3 3 0 0 0-2.154 0L1.962 3.286A1.5 1.5 0 0 0 1 4.686v6.626a1.5 1.5 0 0 0 .962 1.4l4.961 1.908a3 3 0 0 0 2.154 0l4.962-1.908a1.5 1.5 0 0 0 .961-1.4V4.686a1.5 1.5 0 0 0-.961-1.4M7.5 13.757a2 2 0 0 1-.218-.07L2.32 11.779a.5.5 0 0 1-.32-.467V4.971l5.5 2.357zM2.564 4.126l4.718-1.815a2 2 0 0 1 1.436 0l4.718 1.815L8 6.456zM14 11.313a.5.5 0 0 1-.32.467l-4.962 1.908a2 2 0 0 1-.218.07V7.33L14 4.973z" clip-rule="evenodd"/></g></svg>

React

import type { SVGProps } from "react";

export function CodiconPackage(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M6 8.64a.5.5 0 0 1-.197-.041l-2.5-1.07a.499.499 0 1 1 .393-.919l2.5 1.07A.499.499 0 0 1 6 8.639zm-1.196 1.53a.5.5 0 0 0 .656-.264a.5.5 0 0 0-.264-.656l-1.5-.64a.5.5 0 0 0-.392.92z"/><path fillRule="evenodd" d="M14.039 3.286L9.077 1.378a3 3 0 0 0-2.154 0L1.962 3.286A1.5 1.5 0 0 0 1 4.686v6.626a1.5 1.5 0 0 0 .962 1.4l4.961 1.908a3 3 0 0 0 2.154 0l4.962-1.908a1.5 1.5 0 0 0 .961-1.4V4.686a1.5 1.5 0 0 0-.961-1.4M7.5 13.757a2 2 0 0 1-.218-.07L2.32 11.779a.5.5 0 0 1-.32-.467V4.971l5.5 2.357zM2.564 4.126l4.718-1.815a2 2 0 0 1 1.436 0l4.718 1.815L8 6.456zM14 11.313a.5.5 0 0 1-.32.467l-4.962 1.908a2 2 0 0 1-.218.07V7.33L14 4.973z" clipRule="evenodd"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M6 8.64a.5.5 0 0 1-.197-.041l-2.5-1.07a.499.499 0 1 1 .393-.919l2.5 1.07A.499.499 0 0 1 6 8.639zm-1.196 1.53a.5.5 0 0 0 .656-.264a.5.5 0 0 0-.264-.656l-1.5-.64a.5.5 0 0 0-.392.92z"/><path fill-rule="evenodd" d="M14.039 3.286L9.077 1.378a3 3 0 0 0-2.154 0L1.962 3.286A1.5 1.5 0 0 0 1 4.686v6.626a1.5 1.5 0 0 0 .962 1.4l4.961 1.908a3 3 0 0 0 2.154 0l4.962-1.908a1.5 1.5 0 0 0 .961-1.4V4.686a1.5 1.5 0 0 0-.961-1.4M7.5 13.757a2 2 0 0 1-.218-.07L2.32 11.779a.5.5 0 0 1-.32-.467V4.971l5.5 2.357zM2.564 4.126l4.718-1.815a2 2 0 0 1 1.436 0l4.718 1.815L8 6.456zM14 11.313a.5.5 0 0 1-.32.467l-4.962 1.908a2 2 0 0 1-.218.07V7.33L14 4.973z" clip-rule="evenodd"/></g></svg>
</template>

CSS

.icon-package {
  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%2016%2016%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M6%208.64a.5.5%200%200%201-.197-.041l-2.5-1.07a.499.499%200%201%201%20.393-.919l2.5%201.07A.499.499%200%200%201%206%208.639zm-1.196%201.53a.5.5%200%200%200%20.656-.264a.5.5%200%200%200-.264-.656l-1.5-.64a.5.5%200%200%200-.392.92z%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.039%203.286L9.077%201.378a3%203%200%200%200-2.154%200L1.962%203.286A1.5%201.5%200%200%200%201%204.686v6.626a1.5%201.5%200%200%200%20.962%201.4l4.961%201.908a3%203%200%200%200%202.154%200l4.962-1.908a1.5%201.5%200%200%200%20.961-1.4V4.686a1.5%201.5%200%200%200-.961-1.4M7.5%2013.757a2%202%200%200%201-.218-.07L2.32%2011.779a.5.5%200%200%201-.32-.467V4.971l5.5%202.357zM2.564%204.126l4.718-1.815a2%202%200%200%201%201.436%200l4.718%201.815L8%206.456zM14%2011.313a.5.5%200%200%201-.32.467l-4.962%201.908a2%202%200%200%201-.218.07V7.33L14%204.973z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%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%2016%2016%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M6%208.64a.5.5%200%200%201-.197-.041l-2.5-1.07a.499.499%200%201%201%20.393-.919l2.5%201.07A.499.499%200%200%201%206%208.639zm-1.196%201.53a.5.5%200%200%200%20.656-.264a.5.5%200%200%200-.264-.656l-1.5-.64a.5.5%200%200%200-.392.92z%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.039%203.286L9.077%201.378a3%203%200%200%200-2.154%200L1.962%203.286A1.5%201.5%200%200%200%201%204.686v6.626a1.5%201.5%200%200%200%20.962%201.4l4.961%201.908a3%203%200%200%200%202.154%200l4.962-1.908a1.5%201.5%200%200%200%20.961-1.4V4.686a1.5%201.5%200%200%200-.961-1.4M7.5%2013.757a2%202%200%200%201-.218-.07L2.32%2011.779a.5.5%200%200%201-.32-.467V4.971l5.5%202.357zM2.564%204.126l4.718-1.815a2%202%200%200%201%201.436%200l4.718%201.815L8%206.456zM14%2011.313a.5.5%200%200%201-.32.467l-4.962%201.908a2%202%200%200%201-.218.07V7.33L14%204.973z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/codicon/package.svg?color=%231a73e8&size=48