box icon

box from Font Awesome Solid by Dave Gandy · Solid · Logistics · CC-BY-4.0 Attribution required.

Name
box
Set
Font Awesome Solid
Style
Solid
Category
Logistics
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

boxAkar IconsboxBootstrap IconsboxBoxIcons v2boxBoxIcons v2 SolidboxCarbonboxElement PlusboxFont Awesome 6 SolidboxFeather Iconsbox-16-filledFluent UI System Iconsboxcss.ggboxHuge IconsboxHumbleiconsboxIconParkboxIconPark OutlineboxIconPark SolidboxIconPark TwoToneboxIconoirboxJam IconsboxLine AwesomeboxSVG LogosboxLucideboxMage IconsboxMajesticonsboxMaterial Symbols

More logistics icons from Font Awesome Solid

boxesclipboard-checkclipboard-listdollydolly-flatbedpalletshipping-fastbox-openbox-tissuebox-archive

Use the box icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M431.1 80c20.7 0 40.1 10 52.1 26.8l48.9 68.5c7.7 10.8 11.9 23.9 11.9 37.2V480c0 35.3-28.7 64-64 64H160l-6.5-.3C121.2 540.4 96 513.1 96 480V212.5c0-11.7 3.2-23.1 9.2-33l2.7-4.2l48.9-68.5c10.5-14.7 26.7-24.2 44.4-26.3l7.7-.5H431zM344 192h121.3L431 144h-87.1v48zm-169.3 0H296v-48h-87.1l-34.3 48z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidBox(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M431.1 80c20.7 0 40.1 10 52.1 26.8l48.9 68.5c7.7 10.8 11.9 23.9 11.9 37.2V480c0 35.3-28.7 64-64 64H160l-6.5-.3C121.2 540.4 96 513.1 96 480V212.5c0-11.7 3.2-23.1 9.2-33l2.7-4.2l48.9-68.5c10.5-14.7 26.7-24.2 44.4-26.3l7.7-.5H431zM344 192h121.3L431 144h-87.1v48zm-169.3 0H296v-48h-87.1l-34.3 48z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M431.1 80c20.7 0 40.1 10 52.1 26.8l48.9 68.5c7.7 10.8 11.9 23.9 11.9 37.2V480c0 35.3-28.7 64-64 64H160l-6.5-.3C121.2 540.4 96 513.1 96 480V212.5c0-11.7 3.2-23.1 9.2-33l2.7-4.2l48.9-68.5c10.5-14.7 26.7-24.2 44.4-26.3l7.7-.5H431zM344 192h121.3L431 144h-87.1v48zm-169.3 0H296v-48h-87.1l-34.3 48z"/></svg>
</template>

CSS

.icon-box {
  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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M431.1%2080c20.7%200%2040.1%2010%2052.1%2026.8l48.9%2068.5c7.7%2010.8%2011.9%2023.9%2011.9%2037.2V480c0%2035.3-28.7%2064-64%2064H160l-6.5-.3C121.2%20540.4%2096%20513.1%2096%20480V212.5c0-11.7%203.2-23.1%209.2-33l2.7-4.2l48.9-68.5c10.5-14.7%2026.7-24.2%2044.4-26.3l7.7-.5H431zM344%20192h121.3L431%20144h-87.1v48zm-169.3%200H296v-48h-87.1l-34.3%2048z%22%2F%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M431.1%2080c20.7%200%2040.1%2010%2052.1%2026.8l48.9%2068.5c7.7%2010.8%2011.9%2023.9%2011.9%2037.2V480c0%2035.3-28.7%2064-64%2064H160l-6.5-.3C121.2%20540.4%2096%20513.1%2096%20480V212.5c0-11.7%203.2-23.1%209.2-33l2.7-4.2l48.9-68.5c10.5-14.7%2026.7-24.2%2044.4-26.3l7.7-.5H431zM344%20192h121.3L431%20144h-87.1v48zm-169.3%200H296v-48h-87.1l-34.3%2048z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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