magic logo

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

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

The same logo in other sets

magicBootstrap Icons magicJam Icons magicLine Awesome magic-fillRemix Icon

Use the magic logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 0a29.7 29.7 0 0 1-3.611 3.53A27.3 27.3 0 0 1 9.729 12c0 2.948-.47 5.792-1.34 8.47A29.7 29.7 0 0 1 12 24a29.7 29.7 0 0 1 3.611-3.53a27.3 27.3 0 0 1-1.34-8.47c0-2.948.47-5.792 1.34-8.47A29.7 29.7 0 0 1 12 0m6.109 5.381A27.4 27.4 0 0 0 17.3 12c0 2.278.28 4.494.809 6.619a31 31 0 0 1 4.391-2.424A13.7 13.7 0 0 1 21.843 12c0-1.46.23-2.868.657-4.195a31 31 0 0 1-4.391-2.424m-12.218 0A31 31 0 0 1 1.5 7.805A13.7 13.7 0 0 1 2.157 12c0 1.46-.23 2.868-.657 4.195a31 31 0 0 1 4.391 2.424C6.42 16.494 6.7 14.278 6.7 12s-.28-4.494-.809-6.619"/></svg>

React

import type { SVGProps } from "react";

export function SimpleIconsMagic(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="M12 0a29.7 29.7 0 0 1-3.611 3.53A27.3 27.3 0 0 1 9.729 12c0 2.948-.47 5.792-1.34 8.47A29.7 29.7 0 0 1 12 24a29.7 29.7 0 0 1 3.611-3.53a27.3 27.3 0 0 1-1.34-8.47c0-2.948.47-5.792 1.34-8.47A29.7 29.7 0 0 1 12 0m6.109 5.381A27.4 27.4 0 0 0 17.3 12c0 2.278.28 4.494.809 6.619a31 31 0 0 1 4.391-2.424A13.7 13.7 0 0 1 21.843 12c0-1.46.23-2.868.657-4.195a31 31 0 0 1-4.391-2.424m-12.218 0A31 31 0 0 1 1.5 7.805A13.7 13.7 0 0 1 2.157 12c0 1.46-.23 2.868-.657 4.195a31 31 0 0 1 4.391 2.424C6.42 16.494 6.7 14.278 6.7 12s-.28-4.494-.809-6.619"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 0a29.7 29.7 0 0 1-3.611 3.53A27.3 27.3 0 0 1 9.729 12c0 2.948-.47 5.792-1.34 8.47A29.7 29.7 0 0 1 12 24a29.7 29.7 0 0 1 3.611-3.53a27.3 27.3 0 0 1-1.34-8.47c0-2.948.47-5.792 1.34-8.47A29.7 29.7 0 0 1 12 0m6.109 5.381A27.4 27.4 0 0 0 17.3 12c0 2.278.28 4.494.809 6.619a31 31 0 0 1 4.391-2.424A13.7 13.7 0 0 1 21.843 12c0-1.46.23-2.868.657-4.195a31 31 0 0 1-4.391-2.424m-12.218 0A31 31 0 0 1 1.5 7.805A13.7 13.7 0 0 1 2.157 12c0 1.46-.23 2.868-.657 4.195a31 31 0 0 1 4.391 2.424C6.42 16.494 6.7 14.278 6.7 12s-.28-4.494-.809-6.619"/></svg>
</template>

CSS

.icon-magic {
  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%22M12%200a29.7%2029.7%200%200%201-3.611%203.53A27.3%2027.3%200%200%201%209.729%2012c0%202.948-.47%205.792-1.34%208.47A29.7%2029.7%200%200%201%2012%2024a29.7%2029.7%200%200%201%203.611-3.53a27.3%2027.3%200%200%201-1.34-8.47c0-2.948.47-5.792%201.34-8.47A29.7%2029.7%200%200%201%2012%200m6.109%205.381A27.4%2027.4%200%200%200%2017.3%2012c0%202.278.28%204.494.809%206.619a31%2031%200%200%201%204.391-2.424A13.7%2013.7%200%200%201%2021.843%2012c0-1.46.23-2.868.657-4.195a31%2031%200%200%201-4.391-2.424m-12.218%200A31%2031%200%200%201%201.5%207.805A13.7%2013.7%200%200%201%202.157%2012c0%201.46-.23%202.868-.657%204.195a31%2031%200%200%201%204.391%202.424C6.42%2016.494%206.7%2014.278%206.7%2012s-.28-4.494-.809-6.619%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%22M12%200a29.7%2029.7%200%200%201-3.611%203.53A27.3%2027.3%200%200%201%209.729%2012c0%202.948-.47%205.792-1.34%208.47A29.7%2029.7%200%200%201%2012%2024a29.7%2029.7%200%200%201%203.611-3.53a27.3%2027.3%200%200%201-1.34-8.47c0-2.948.47-5.792%201.34-8.47A29.7%2029.7%200%200%201%2012%200m6.109%205.381A27.4%2027.4%200%200%200%2017.3%2012c0%202.278.28%204.494.809%206.619a31%2031%200%200%201%204.391-2.424A13.7%2013.7%200%200%201%2021.843%2012c0-1.46.23-2.868.657-4.195a31%2031%200%200%201-4.391-2.424m-12.218%200A31%2031%200%200%201%201.5%207.805A13.7%2013.7%200%200%201%202.157%2012c0%201.46-.23%202.868-.657%204.195a31%2031%200%200%201%204.391%202.424C6.42%2016.494%206.7%2014.278%206.7%2012s-.28-4.494-.809-6.619%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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