Home Svg Icon

Free SVG icon from the IconaMoon collection. Download or copy for use in any project.

Collection: IconaMoon
Format: SVG, PNG
License: CC BY 4.0 - Free for commercial use
Tags: home svg house dashboard main start

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/308259.svg" alt="Home   Svg icon" width="24" height="24">

React JSX

<img src="https://proicons.com/icon/308259.svg" alt="Home   Svg icon" width={24} height={24} />

Vue template

<img
  src="https://proicons.com/icon/308259.svg"
  alt="Home   Svg icon"
  :width="24"
  :height="24"
/>

CSS background

.icon-home---svg {
  background-image: url('https://proicons.com/icon/308259.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 d="M17 21H7C5.89543 21 5 20.1046 5 19V10L12 3L19 10V19C19 20.1046 18.1046 21 17 21Z" fill="#58CC02"/>
<path d="M19 10H20C20 9.73478 19.8946 9.48043 19.7071 9.29289L19 10ZM5 10L4.29289 9.29289C4.10536 9.48043 4 9.73478 4 10H5ZM12 3L12.7071 2.29289C12.3166 1.90237 11.6834 1.90237 11.2929 2.29289L12 3ZM7 22H17V20H7V22ZM20 19V10H18V19H20ZM6 19V10H4V19H6ZM5.70711 10.7071L12.7071 3.70711L11.2929 2.29289L4.29289 9.29289L5.70711 10.7071ZM19.7071 9.29289L12.7071 2.29289L11.2929 3.70711L18.2929 10.7071L19.7071 9.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="#58CC02"/>
<path d="M21 12L12 3L3 12" stroke="#58A700" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

Copied!

Home Svg Icon

More from IconaMoon