homarr logo

homarr from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.

Name: homarr
Set: Simple Icons
Style: Brand
Viewbox: 24×24
License: CC0 1.0

Use the homarr logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6.256 15.698a6.52 6.52 0 0 0 1.25-3.848a6.52 6.52 0 0 0-2.011-4.716a6.5 6.5 0 0 0-.833-.678a6.5 6.5 0 0 0-2.881-1.095l-.002.002l1.251 5.1H0a6.03 6.03 0 0 0 4.253 4.991l.435 1.772a6.6 6.6 0 0 0 1.568-1.528m14.714-5.235l1.251-5.1l-.002-.002a6.5 6.5 0 0 0-2.881 1.095a6.6 6.6 0 0 0-.833.678a6.52 6.52 0 0 0-2.01 4.716a6.52 6.52 0 0 0 1.25 3.848a6.6 6.6 0 0 0 1.567 1.528l.435-1.772A6.03 6.03 0 0 0 24 10.462zm-7.615 3.543a.82.82 0 0 0 .821-.822a.82.82 0 0 0-.821-.821a.82.82 0 0 0-.822.821c0 .454.368.822.822.822m-2.71-1.643a.82.82 0 0 0-.82.821a.82.82 0 0 0 .82.822a.82.82 0 0 0 .823-.822a.82.82 0 0 0-.822-.821m-.538 2.897a7.8 7.8 0 0 0-4.13 2.533a7.8 7.8 0 0 0-1.342 2.252l2.184.013l12.444.056l.002-.004a7.83 7.83 0 0 0-9.157-4.85Zm3.247-4.91c.09 0 .178.018.26.046V7.263a2.448 2.448 0 0 1 4.5-1.332q.356-.298.749-.552a3.376 3.376 0 0 0-6.177 1.884v3.433a.82.82 0 0 1 .667-.346zM7.937 4.814a2.45 2.45 0 0 1 2.448 2.449v3.133a.8.8 0 0 1 .26-.046a.82.82 0 0 1 .668.346V7.263a3.38 3.38 0 0 0-3.376-3.376a3.38 3.38 0 0 0-2.8 1.492q.39.254.748.552a2.45 2.45 0 0 1 2.052-1.117"/></svg>

React

import type { SVGProps } from "react";

export function SimpleIconsHomarr(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6.256 15.698a6.52 6.52 0 0 0 1.25-3.848a6.52 6.52 0 0 0-2.011-4.716a6.5 6.5 0 0 0-.833-.678a6.5 6.5 0 0 0-2.881-1.095l-.002.002l1.251 5.1H0a6.03 6.03 0 0 0 4.253 4.991l.435 1.772a6.6 6.6 0 0 0 1.568-1.528m14.714-5.235l1.251-5.1l-.002-.002a6.5 6.5 0 0 0-2.881 1.095a6.6 6.6 0 0 0-.833.678a6.52 6.52 0 0 0-2.01 4.716a6.52 6.52 0 0 0 1.25 3.848a6.6 6.6 0 0 0 1.567 1.528l.435-1.772A6.03 6.03 0 0 0 24 10.462zm-7.615 3.543a.82.82 0 0 0 .821-.822a.82.82 0 0 0-.821-.821a.82.82 0 0 0-.822.821c0 .454.368.822.822.822m-2.71-1.643a.82.82 0 0 0-.82.821a.82.82 0 0 0 .82.822a.82.82 0 0 0 .823-.822a.82.82 0 0 0-.822-.821m-.538 2.897a7.8 7.8 0 0 0-4.13 2.533a7.8 7.8 0 0 0-1.342 2.252l2.184.013l12.444.056l.002-.004a7.83 7.83 0 0 0-9.157-4.85Zm3.247-4.91c.09 0 .178.018.26.046V7.263a2.448 2.448 0 0 1 4.5-1.332q.356-.298.749-.552a3.376 3.376 0 0 0-6.177 1.884v3.433a.82.82 0 0 1 .667-.346zM7.937 4.814a2.45 2.45 0 0 1 2.448 2.449v3.133a.8.8 0 0 1 .26-.046a.82.82 0 0 1 .668.346V7.263a3.38 3.38 0 0 0-3.376-3.376a3.38 3.38 0 0 0-2.8 1.492q.39.254.748.552a2.45 2.45 0 0 1 2.052-1.117"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6.256 15.698a6.52 6.52 0 0 0 1.25-3.848a6.52 6.52 0 0 0-2.011-4.716a6.5 6.5 0 0 0-.833-.678a6.5 6.5 0 0 0-2.881-1.095l-.002.002l1.251 5.1H0a6.03 6.03 0 0 0 4.253 4.991l.435 1.772a6.6 6.6 0 0 0 1.568-1.528m14.714-5.235l1.251-5.1l-.002-.002a6.5 6.5 0 0 0-2.881 1.095a6.6 6.6 0 0 0-.833.678a6.52 6.52 0 0 0-2.01 4.716a6.52 6.52 0 0 0 1.25 3.848a6.6 6.6 0 0 0 1.567 1.528l.435-1.772A6.03 6.03 0 0 0 24 10.462zm-7.615 3.543a.82.82 0 0 0 .821-.822a.82.82 0 0 0-.821-.821a.82.82 0 0 0-.822.821c0 .454.368.822.822.822m-2.71-1.643a.82.82 0 0 0-.82.821a.82.82 0 0 0 .82.822a.82.82 0 0 0 .823-.822a.82.82 0 0 0-.822-.821m-.538 2.897a7.8 7.8 0 0 0-4.13 2.533a7.8 7.8 0 0 0-1.342 2.252l2.184.013l12.444.056l.002-.004a7.83 7.83 0 0 0-9.157-4.85Zm3.247-4.91c.09 0 .178.018.26.046V7.263a2.448 2.448 0 0 1 4.5-1.332q.356-.298.749-.552a3.376 3.376 0 0 0-6.177 1.884v3.433a.82.82 0 0 1 .667-.346zM7.937 4.814a2.45 2.45 0 0 1 2.448 2.449v3.133a.8.8 0 0 1 .26-.046a.82.82 0 0 1 .668.346V7.263a3.38 3.38 0 0 0-3.376-3.376a3.38 3.38 0 0 0-2.8 1.492q.39.254.748.552a2.45 2.45 0 0 1 2.052-1.117"/></svg>
</template>

CSS

.icon-homarr {
  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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M6.256%2015.698a6.52%206.52%200%200%200%201.25-3.848a6.52%206.52%200%200%200-2.011-4.716a6.5%206.5%200%200%200-.833-.678a6.5%206.5%200%200%200-2.881-1.095l-.002.002l1.251%205.1H0a6.03%206.03%200%200%200%204.253%204.991l.435%201.772a6.6%206.6%200%200%200%201.568-1.528m14.714-5.235l1.251-5.1l-.002-.002a6.5%206.5%200%200%200-2.881%201.095a6.6%206.6%200%200%200-.833.678a6.52%206.52%200%200%200-2.01%204.716a6.52%206.52%200%200%200%201.25%203.848a6.6%206.6%200%200%200%201.567%201.528l.435-1.772A6.03%206.03%200%200%200%2024%2010.462zm-7.615%203.543a.82.82%200%200%200%20.821-.822a.82.82%200%200%200-.821-.821a.82.82%200%200%200-.822.821c0%20.454.368.822.822.822m-2.71-1.643a.82.82%200%200%200-.82.821a.82.82%200%200%200%20.82.822a.82.82%200%200%200%20.823-.822a.82.82%200%200%200-.822-.821m-.538%202.897a7.8%207.8%200%200%200-4.13%202.533a7.8%207.8%200%200%200-1.342%202.252l2.184.013l12.444.056l.002-.004a7.83%207.83%200%200%200-9.157-4.85Zm3.247-4.91c.09%200%20.178.018.26.046V7.263a2.448%202.448%200%200%201%204.5-1.332q.356-.298.749-.552a3.376%203.376%200%200%200-6.177%201.884v3.433a.82.82%200%200%201%20.667-.346zM7.937%204.814a2.45%202.45%200%200%201%202.448%202.449v3.133a.8.8%200%200%201%20.26-.046a.82.82%200%200%201%20.668.346V7.263a3.38%203.38%200%200%200-3.376-3.376a3.38%203.38%200%200%200-2.8%201.492q.39.254.748.552a2.45%202.45%200%200%201%202.052-1.117%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M6.256%2015.698a6.52%206.52%200%200%200%201.25-3.848a6.52%206.52%200%200%200-2.011-4.716a6.5%206.5%200%200%200-.833-.678a6.5%206.5%200%200%200-2.881-1.095l-.002.002l1.251%205.1H0a6.03%206.03%200%200%200%204.253%204.991l.435%201.772a6.6%206.6%200%200%200%201.568-1.528m14.714-5.235l1.251-5.1l-.002-.002a6.5%206.5%200%200%200-2.881%201.095a6.6%206.6%200%200%200-.833.678a6.52%206.52%200%200%200-2.01%204.716a6.52%206.52%200%200%200%201.25%203.848a6.6%206.6%200%200%200%201.567%201.528l.435-1.772A6.03%206.03%200%200%200%2024%2010.462zm-7.615%203.543a.82.82%200%200%200%20.821-.822a.82.82%200%200%200-.821-.821a.82.82%200%200%200-.822.821c0%20.454.368.822.822.822m-2.71-1.643a.82.82%200%200%200-.82.821a.82.82%200%200%200%20.82.822a.82.82%200%200%200%20.823-.822a.82.82%200%200%200-.822-.821m-.538%202.897a7.8%207.8%200%200%200-4.13%202.533a7.8%207.8%200%200%200-1.342%202.252l2.184.013l12.444.056l.002-.004a7.83%207.83%200%200%200-9.157-4.85Zm3.247-4.91c.09%200%20.178.018.26.046V7.263a2.448%202.448%200%200%201%204.5-1.332q.356-.298.749-.552a3.376%203.376%200%200%200-6.177%201.884v3.433a.82.82%200%200%201%20.667-.346zM7.937%204.814a2.45%202.45%200%200%201%202.448%202.449v3.133a.8.8%200%200%201%20.26-.046a.82.82%200%200%201%20.668.346V7.263a3.38%203.38%200%200%200-3.376-3.376a3.38%203.38%200%200%200-2.8%201.492q.39.254.748.552a2.45%202.45%200%200%201%202.052-1.117%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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