building store icon
building-store-24 from Fluent UI System Color Icons by Microsoft Corporation · 24 · MIT Free for personal and commercial use.
- Name
- building-store-24
- Set
- Fluent UI System Color Icons
- Style
- 24
- Viewbox
- 24×24
- License
- MIT
2 other variants in Fluent UI System Color Icons
The same icon in other sets
Related icons in Fluent UI System Color Icons
Use the building store icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGwUgtLdtI)" d="M3 9.75A.75.75 0 0 1 3.75 9h16.5a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-.75.75H3.75a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGXufiEe2l)" fill-opacity=".8" d="M6 13.75a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 .75.75V22H6z"/><path fill="url(#SVGTsGPHdQz)" fill-opacity=".8" d="M13 13.75a.75.75 0 0 1 .75-.75h3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-3.5a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGD4tYAcor)" d="m14 6l-1-4h4.909a1 1 0 0 1 .738.326l3.092 3.388a1 1 0 0 1 .261.674V8a4 4 0 0 1-8 0z"/><path fill="url(#SVG3R7RHbCj)" d="M2 6.388a1 1 0 0 1 .261-.674l3.092-3.388A1 1 0 0 1 6.09 2H11l-1 4v2a4 4 0 0 1-8 0z"/><path fill="url(#SVGdYvFhdSh)" d="M8 6.176a1 1 0 0 1 .062-.34L9.5 2h5l1.438 3.835a1 1 0 0 1 .062.341V8a4 4 0 0 1-8 0z"/><defs><linearGradient id="SVGwUgtLdtI" x1="7.5" x2="9.684" y1="10.182" y2="22.659" gradientUnits="userSpaceOnUse"><stop offset=".312" stop-color="#29c3ff"/><stop offset="1" stop-color="#0094f0"/></linearGradient><linearGradient id="SVGXufiEe2l" x1="6.214" x2="12.033" y1="14.688" y2="18.718" gradientUnits="userSpaceOnUse"><stop stop-color="#0067bf"/><stop offset="1" stop-color="#003580"/></linearGradient><linearGradient id="SVGTsGPHdQz" x1="14.5" x2="16.327" y1="12.444" y2="19.02" gradientUnits="userSpaceOnUse"><stop stop-color="#fdfdfd"/><stop offset="1" stop-color="#b3e0ff"/></linearGradient><linearGradient id="SVGD4tYAcor" x1="17.154" x2="17.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stop-color="#fb6f7b"/><stop offset="1" stop-color="#d7257d"/></linearGradient><linearGradient id="SVG3R7RHbCj" x1="6.154" x2="6.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stop-color="#fb6f7b"/><stop offset="1" stop-color="#d7257d"/></linearGradient><linearGradient id="SVGdYvFhdSh" x1="12" x2="12" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop offset=".304" stop-color="#ff9fb2"/><stop offset="1" stop-color="#f97dbd"/></linearGradient></defs></g></svg>
React
import type { SVGProps } from "react";
export function FluentColorBuildingStore24(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGwUgtLdtI)" d="M3 9.75A.75.75 0 0 1 3.75 9h16.5a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-.75.75H3.75a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGXufiEe2l)" fillOpacity=".8" d="M6 13.75a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 .75.75V22H6z"/><path fill="url(#SVGTsGPHdQz)" fillOpacity=".8" d="M13 13.75a.75.75 0 0 1 .75-.75h3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-3.5a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGD4tYAcor)" d="m14 6l-1-4h4.909a1 1 0 0 1 .738.326l3.092 3.388a1 1 0 0 1 .261.674V8a4 4 0 0 1-8 0z"/><path fill="url(#SVG3R7RHbCj)" d="M2 6.388a1 1 0 0 1 .261-.674l3.092-3.388A1 1 0 0 1 6.09 2H11l-1 4v2a4 4 0 0 1-8 0z"/><path fill="url(#SVGdYvFhdSh)" d="M8 6.176a1 1 0 0 1 .062-.34L9.5 2h5l1.438 3.835a1 1 0 0 1 .062.341V8a4 4 0 0 1-8 0z"/><defs><linearGradient id="SVGwUgtLdtI" x1="7.5" x2="9.684" y1="10.182" y2="22.659" gradientUnits="userSpaceOnUse"><stop offset=".312" stopColor="#29c3ff"/><stop offset="1" stopColor="#0094f0"/></linearGradient><linearGradient id="SVGXufiEe2l" x1="6.214" x2="12.033" y1="14.688" y2="18.718" gradientUnits="userSpaceOnUse"><stop stopColor="#0067bf"/><stop offset="1" stopColor="#003580"/></linearGradient><linearGradient id="SVGTsGPHdQz" x1="14.5" x2="16.327" y1="12.444" y2="19.02" gradientUnits="userSpaceOnUse"><stop stopColor="#fdfdfd"/><stop offset="1" stopColor="#b3e0ff"/></linearGradient><linearGradient id="SVGD4tYAcor" x1="17.154" x2="17.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stopColor="#fb6f7b"/><stop offset="1" stopColor="#d7257d"/></linearGradient><linearGradient id="SVG3R7RHbCj" x1="6.154" x2="6.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stopColor="#fb6f7b"/><stop offset="1" stopColor="#d7257d"/></linearGradient><linearGradient id="SVGdYvFhdSh" x1="12" x2="12" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop offset=".304" stopColor="#ff9fb2"/><stop offset="1" stopColor="#f97dbd"/></linearGradient></defs></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGwUgtLdtI)" d="M3 9.75A.75.75 0 0 1 3.75 9h16.5a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-.75.75H3.75a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGXufiEe2l)" fill-opacity=".8" d="M6 13.75a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 .75.75V22H6z"/><path fill="url(#SVGTsGPHdQz)" fill-opacity=".8" d="M13 13.75a.75.75 0 0 1 .75-.75h3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-3.5a.75.75 0 0 1-.75-.75z"/><path fill="url(#SVGD4tYAcor)" d="m14 6l-1-4h4.909a1 1 0 0 1 .738.326l3.092 3.388a1 1 0 0 1 .261.674V8a4 4 0 0 1-8 0z"/><path fill="url(#SVG3R7RHbCj)" d="M2 6.388a1 1 0 0 1 .261-.674l3.092-3.388A1 1 0 0 1 6.09 2H11l-1 4v2a4 4 0 0 1-8 0z"/><path fill="url(#SVGdYvFhdSh)" d="M8 6.176a1 1 0 0 1 .062-.34L9.5 2h5l1.438 3.835a1 1 0 0 1 .062.341V8a4 4 0 0 1-8 0z"/><defs><linearGradient id="SVGwUgtLdtI" x1="7.5" x2="9.684" y1="10.182" y2="22.659" gradientUnits="userSpaceOnUse"><stop offset=".312" stop-color="#29c3ff"/><stop offset="1" stop-color="#0094f0"/></linearGradient><linearGradient id="SVGXufiEe2l" x1="6.214" x2="12.033" y1="14.688" y2="18.718" gradientUnits="userSpaceOnUse"><stop stop-color="#0067bf"/><stop offset="1" stop-color="#003580"/></linearGradient><linearGradient id="SVGTsGPHdQz" x1="14.5" x2="16.327" y1="12.444" y2="19.02" gradientUnits="userSpaceOnUse"><stop stop-color="#fdfdfd"/><stop offset="1" stop-color="#b3e0ff"/></linearGradient><linearGradient id="SVGD4tYAcor" x1="17.154" x2="17.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stop-color="#fb6f7b"/><stop offset="1" stop-color="#d7257d"/></linearGradient><linearGradient id="SVG3R7RHbCj" x1="6.154" x2="6.154" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop stop-color="#fb6f7b"/><stop offset="1" stop-color="#d7257d"/></linearGradient><linearGradient id="SVGdYvFhdSh" x1="12" x2="12" y1="2" y2="6.375" gradientUnits="userSpaceOnUse"><stop offset=".304" stop-color="#ff9fb2"/><stop offset="1" stop-color="#f97dbd"/></linearGradient></defs></g></svg> </template>
CSS
.icon-building-store-24 {
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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGwUgtLdtI)%22%20d%3D%22M3%209.75A.75.75%200%200%201%203.75%209h16.5a.75.75%200%200%201%20.75.75v11.5a.75.75%200%200%201-.75.75H3.75a.75.75%200%200%201-.75-.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGXufiEe2l)%22%20fill-opacity%3D%22.8%22%20d%3D%22M6%2013.75a.75.75%200%200%201%20.75-.75h4.5a.75.75%200%200%201%20.75.75V22H6z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGTsGPHdQz)%22%20fill-opacity%3D%22.8%22%20d%3D%22M13%2013.75a.75.75%200%200%201%20.75-.75h3.5a.75.75%200%200%201%20.75.75v3.5a.75.75%200%200%201-.75.75h-3.5a.75.75%200%200%201-.75-.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGD4tYAcor)%22%20d%3D%22m14%206l-1-4h4.909a1%201%200%200%201%20.738.326l3.092%203.388a1%201%200%200%201%20.261.674V8a4%204%200%200%201-8%200z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG3R7RHbCj)%22%20d%3D%22M2%206.388a1%201%200%200%201%20.261-.674l3.092-3.388A1%201%200%200%201%206.09%202H11l-1%204v2a4%204%200%200%201-8%200z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGdYvFhdSh)%22%20d%3D%22M8%206.176a1%201%200%200%201%20.062-.34L9.5%202h5l1.438%203.835a1%201%200%200%201%20.062.341V8a4%204%200%200%201-8%200z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGwUgtLdtI%22%20x1%3D%227.5%22%20x2%3D%229.684%22%20y1%3D%2210.182%22%20y2%3D%2222.659%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.312%22%20stop-color%3D%22%2329c3ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230094f0%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGXufiEe2l%22%20x1%3D%226.214%22%20x2%3D%2212.033%22%20y1%3D%2214.688%22%20y2%3D%2218.718%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230067bf%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23003580%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGTsGPHdQz%22%20x1%3D%2214.5%22%20x2%3D%2216.327%22%20y1%3D%2212.444%22%20y2%3D%2219.02%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fdfdfd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23b3e0ff%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGD4tYAcor%22%20x1%3D%2217.154%22%20x2%3D%2217.154%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fb6f7b%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d7257d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG3R7RHbCj%22%20x1%3D%226.154%22%20x2%3D%226.154%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fb6f7b%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d7257d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGdYvFhdSh%22%20x1%3D%2212%22%20x2%3D%2212%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.304%22%20stop-color%3D%22%23ff9fb2%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f97dbd%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGwUgtLdtI)%22%20d%3D%22M3%209.75A.75.75%200%200%201%203.75%209h16.5a.75.75%200%200%201%20.75.75v11.5a.75.75%200%200%201-.75.75H3.75a.75.75%200%200%201-.75-.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGXufiEe2l)%22%20fill-opacity%3D%22.8%22%20d%3D%22M6%2013.75a.75.75%200%200%201%20.75-.75h4.5a.75.75%200%200%201%20.75.75V22H6z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGTsGPHdQz)%22%20fill-opacity%3D%22.8%22%20d%3D%22M13%2013.75a.75.75%200%200%201%20.75-.75h3.5a.75.75%200%200%201%20.75.75v3.5a.75.75%200%200%201-.75.75h-3.5a.75.75%200%200%201-.75-.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGD4tYAcor)%22%20d%3D%22m14%206l-1-4h4.909a1%201%200%200%201%20.738.326l3.092%203.388a1%201%200%200%201%20.261.674V8a4%204%200%200%201-8%200z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG3R7RHbCj)%22%20d%3D%22M2%206.388a1%201%200%200%201%20.261-.674l3.092-3.388A1%201%200%200%201%206.09%202H11l-1%204v2a4%204%200%200%201-8%200z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGdYvFhdSh)%22%20d%3D%22M8%206.176a1%201%200%200%201%20.062-.34L9.5%202h5l1.438%203.835a1%201%200%200%201%20.062.341V8a4%204%200%200%201-8%200z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGwUgtLdtI%22%20x1%3D%227.5%22%20x2%3D%229.684%22%20y1%3D%2210.182%22%20y2%3D%2222.659%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.312%22%20stop-color%3D%22%2329c3ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230094f0%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGXufiEe2l%22%20x1%3D%226.214%22%20x2%3D%2212.033%22%20y1%3D%2214.688%22%20y2%3D%2218.718%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230067bf%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23003580%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGTsGPHdQz%22%20x1%3D%2214.5%22%20x2%3D%2216.327%22%20y1%3D%2212.444%22%20y2%3D%2219.02%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fdfdfd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23b3e0ff%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGD4tYAcor%22%20x1%3D%2217.154%22%20x2%3D%2217.154%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fb6f7b%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d7257d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG3R7RHbCj%22%20x1%3D%226.154%22%20x2%3D%226.154%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fb6f7b%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d7257d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGdYvFhdSh%22%20x1%3D%2212%22%20x2%3D%2212%22%20y1%3D%222%22%20y2%3D%226.375%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.304%22%20stop-color%3D%22%23ff9fb2%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f97dbd%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-color/building-store-24.svg?color=%231a73e8&size=48
