Magit icon

file-icons:magit

The Magit icon (file-icons:magit) is a free SVG icon from the File Icons set by John Gardner. It is drawn on a 512 × 512 grid. File Icons are released under the ISC license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: File Icons
Author: John Gardner
License: ISC
Size: 512 × 512

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M206.268 491.4L20.6 305.732c-27.467-27.466-27.467-71.998 0-99.464L206.268 20.6c27.466-27.467 71.998-27.467 99.464 0L491.4 206.268c27.467 27.466 27.467 71.998 0 99.464L305.732 491.4c-27.466 27.467-71.998 27.467-99.464 0m72.789-113.33l-5.588-102.477c-23.267 17.816-93.923 20.922-122.633 0l-5.587 102.37c2.19 31.855 133.136 31.207 133.808.107m-105.905-84.84c-4.816-1.248-9.156-2.714-12.895-4.367l-4.602 94.182c4.402 2.469 10.03 4.626 16.599 6.359zm38.55-42.78l-22.489-62.287h-23.701v65.958c3.824 1.322 8.576 2.474 14.074 3.407v-46.782l18.618 48.858c9.048.576 17.653.645 25.867.266l20.21-48.979v47.129c5.553-.82 10.5-1.847 14.662-3.043v-66.814h-23.4zm1.032 14.624c-43.511.254-84.191-11.732-59.99-25.06v-15.573c-35.157 5.042-48.55 13.526-48.55 23.146c0 15.467 48.285 28.006 108.436 28.006s109.836-12.539 109.836-28.006c0-9.62-18.548-18.104-46.673-23.146v15.573c17.642 11.502-8.113 24.355-63.06 25.06m220.364 42.638l6.841-6.841a5.053 5.053 0 0 0 0-7.126L257.064 110.869c-2.115-2.085-5.066-1.86-7.126 0l-6.841 6.842a5.053 5.053 0 0 0 0 7.126l182.875 182.875c2.157 2.18 5.465 1.756 7.126 0m-144.02-144.407l6.842-6.712l-42.419-42.677l-6.841 6.84zm-53.675-11.25h-16.555V135.5h-11.036v16.555h-16.554v11.036h16.554v16.554h11.036v-16.554h16.555zm16.248-90.167h-16.554V45.334h-11.036v16.554h-16.555v11.037h16.555v16.554h11.036V72.925h16.554zm92.888 52.754v-11.036h-44.145v11.036z"/></svg>

How to use the Magit icon

React

import { Icon } from "@iconify/react";

<Icon icon="file-icons:magit" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="file-icons:magit" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="file-icons:magit" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[file-icons--magit]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/file-icons -->
<div class="i-file-icons:magit"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="file-icons:magit"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/file-icons/magit.svg" alt="Magit icon" width="24" height="24">

Magit icon FAQ

Is the Magit icon free for commercial use?

Yes. File Icons are released under the ISC license, which allows use in personal and commercial projects.

How do I use the Magit icon in React?

Install @iconify/react and render <Icon icon="file-icons:magit" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Magit icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/file-icons/magit.svg" alt="Magit icon">, or paste the SVG code inline to style it with CSS.

Browse all File Icons →