Building Shop icon

Use the Building Shop icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.

npm install @fluentui/react-icons

import { BuildingShop24Regular, BuildingShop24Filled } from "@fluentui/react-icons";

export function Example() {
  return <BuildingShop24Regular aria-label="Building Shop" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_building_shop_24_regular.svg" width="24" height="24" alt="Building Shop">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.0004 2C18.1743 2 18.3416 2.06037 18.4747 2.16902L18.5502 2.23991L21.8225 5.76824L21.8531 5.80714C21.9549 5.94281 22.0008 6.09665 22.0008 6.24775L21.9993 8.16674C21.9993 9.16092 21.6207 10.0667 20.9999 10.7478L20.9991 21.25C20.9991 21.6297 20.717 21.9435 20.3509 21.9932L20.2491 22H3.75162C3.37193 22 3.05813 21.7178 3.00847 21.3518L3.00162 21.25L3.00084 10.7478C2.42778 10.1191 2.06115 9.29893 2.00814 8.39453L2.00148 8.16674L2.00129 6.29097C1.99322 6.15366 2.02287 6.01238 2.09722 5.88313L2.16248 5.78767L2.20166 5.74193L5.45055 2.23991C5.56882 2.11243 5.72689 2.03081 5.89705 2.00715L6.00038 2H18.0004ZM15.0823 10.4421L15.0704 10.4598C14.3715 11.3944 13.256 11.9993 11.9992 11.9993C10.7354 11.9993 9.61442 11.3876 8.91629 10.4441C8.21884 11.3876 7.09788 11.9993 5.83406 11.9993C5.36495 11.9993 4.91553 11.915 4.50011 11.7608L4.50138 20.499H6L6.00038 13.751C6.00038 13.3713 6.28253 13.0575 6.64861 13.0079L6.75038 13.001H11.2463C11.626 13.001 11.9398 13.2832 11.9895 13.6492L11.9963 13.751L11.996 20.499H19.4984L19.4986 11.7615C19.0838 11.9153 18.635 11.9993 18.1667 11.9993C16.902 11.9993 15.7804 11.3867 15.0823 10.4421ZM10.4954 14.501H7.50038V20.499H10.4954V14.501ZM17.2551 13.001C17.6348 13.001 17.9486 13.2832 17.9982 13.6492L18.0051 13.751V17.253C18.0051 17.6327 17.7229 17.9465 17.3569 17.9962L17.2551 18.003H13.7537C13.374 18.003 13.0602 17.7209 13.0105 17.3548L13.0037 17.253V13.751C13.0037 13.3713 13.2858 13.0575 13.6519 13.0079L13.7537 13.001H17.2551ZM16.5044 14.501H14.5034V16.503H16.5044V14.501ZM8.16638 7.002H3.50138L3.50148 8.16674L3.50766 8.33777L3.53604 8.569L3.56878 8.72528L3.61816 8.89726L3.67252 9.0451L3.7132 9.1391C3.74437 9.20697 3.7787 9.27309 3.816 9.33727L3.91894 9.49873L3.97323 9.57344L4.102 9.72909L4.24377 9.87318L4.34002 9.95811L4.38211 9.99243C4.69664 10.2429 5.07735 10.4138 5.49378 10.4747L5.67435 10.4939L5.83406 10.4993C7.06862 10.4993 8.07918 9.54019 8.16125 8.32644L8.16663 8.16674L8.16638 7.002ZM14.3314 7.002H9.66638L9.66663 8.16674C9.66663 9.34763 10.5442 10.3236 11.6827 10.478L11.8395 10.4939L11.9992 10.4993C13.2338 10.4993 14.2443 9.54019 14.3264 8.32644L14.3318 8.16674L14.3314 7.002ZM20.4984 7.002H15.8334L15.8341 8.16674C15.8341 9.34763 16.7117 10.3236 17.8502 10.478L18.007 10.4939L18.1667 10.4993C18.731 10.4993 19.2485 10.2989 19.6519 9.96542L19.7417 9.88731L19.8575 9.7736L20.0037 9.60441C20.0577 9.53545 20.108 9.46337 20.1541 9.38849L20.2576 9.20179L20.3205 9.06383L20.3788 8.90873L20.4085 8.81314L20.4468 8.66108L20.4751 8.50352L20.4932 8.33678L20.4993 8.16674L20.4984 7.002ZM9.062 3.499H6.32738L4.46938 5.502H8.446L9.062 3.499ZM13.369 3.499H10.631L10.015 5.502H13.985L13.369 3.499ZM17.6724 3.499H14.938L15.554 5.502H19.5304L17.6724 3.499Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/building_shop_24_regular.svg";

Details

Keywords

structureconstructionarchitectureshop