Home Svg Icon
Free SVG icon from the IconaMoon collection. Download or copy for use in any project.
The Home Svg icon is commonly used in navigation bars, dashboards and breadcrumbs. Available as a free SVG - copy the code or download directly.
img tag
<img src="https://proicons.com/icon/308563.svg" alt="Home Svg icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/308563.svg" alt="Home Svg icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/308563.svg" alt="Home Svg icon" :width="24" :height="24" />
CSS background
.icon-home---svg {
background-image: url('https://proicons.com/icon/308563.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path opacity="0.16" d="M17 21H7C5.89543 21 5 20.1046 5 19V10L12 3L19 10V19C19 20.1046 18.1046 21 17 21Z" fill="#292929"/> <path d="M20 10C20 9.44772 19.5523 9 19 9C18.4477 9 18 9.44772 18 10H20ZM6 10C6 9.44772 5.55228 9 5 9C4.44772 9 4 9.44772 4 10H6ZM20.2929 12.7071C20.6834 13.0976 21.3166 13.0976 21.7071 12.7071C22.0976 12.3166 22.0976 11.6834 21.7071 11.2929L20.2929 12.7071ZM12 3L12.7071 2.29289C12.3166 1.90237 11.6834 1.90237 11.2929 2.29289L12 3ZM2.29289 11.2929C1.90237 11.6834 1.90237 12.3166 2.29289 12.7071C2.68342 13.0976 3.31658 13.0976 3.70711 12.7071L2.29289 11.2929ZM7 22H17V20H7V22ZM20 19V10H18V19H20ZM6 19V10H4V19H6ZM21.7071 11.2929L12.7071 2.29289L11.2929 3.70711L20.2929 12.7071L21.7071 11.2929ZM11.2929 2.29289L2.29289 11.2929L3.70711 12.7071L12.7071 3.70711L11.2929 2.29289ZM17 22C18.6569 22 20 20.6569 20 19H18C18 19.5523 17.5523 20 17 20V22ZM7 20C6.44772 20 6 19.5523 6 19H4C4 20.6569 5.34315 22 7 22V20Z" fill="#292929"/> </svg>
Copied!