apple icon

apple from Mage Icons by MageIcons · Outline · Apache-2.0 Free for personal and commercial use.

Name
apple
Set
Mage Icons
Style
Outline
Viewbox
24×24
License
Apache 2.0

The same icon in other sets

appleBootstrap IconsappleBoxicons BrandsappleCarbonappleCatppuccin IconsappleDeviconappleFont Awesome 6 BrandsappleHuge IconsappleIconoirappleJam IconsappleLine AwesomeappleSVG LogosappleLucideappleMaterial Design Iconsapple-fillMingCute IconappleOpenMojiapplePixelarticonsapple-fillRemix IconappleSimple Iconsapple-darkSkill IconsappleTabler Iconsapple-outlineTeenyiconsappleUniconsappleUnicons Monochrome

Use the apple icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M19.89 8.748a4.22 4.22 0 0 0-2.227 4.086a4.46 4.46 0 0 0 2.744 3.828a.4.4 0 0 1 0 .094a11.8 11.8 0 0 1-2.45 4.11a3.12 3.12 0 0 1-1.66 1.06a2.9 2.9 0 0 1-1.448-.118c-.495-.153-.978-.353-1.484-.495a4.23 4.23 0 0 0-2.661.236q-.644.235-1.308.4a2 2 0 0 1-1.566-.294a5.9 5.9 0 0 1-1.413-1.284a12.4 12.4 0 0 1-2.673-5.994a7.54 7.54 0 0 1 .435-4.44a5.06 5.06 0 0 1 3.734-3.062a4.26 4.26 0 0 1 2.272.189l1.555.53c.273.105.575.105.848 0a19 19 0 0 1 2.014-.648a4.86 4.86 0 0 1 5.11 1.59z"/><path fill="currentColor" d="M16.191 2a3.9 3.9 0 0 1-.235 1.814a4.93 4.93 0 0 1-2.143 2.496a3.1 3.1 0 0 1-1.614.436c-.153 0-.188 0-.2-.2a4.18 4.18 0 0 1 .907-2.709a4.7 4.7 0 0 1 3.05-1.813z"/></svg>

React

import type { SVGProps } from "react";

export function MageApple(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="M19.89 8.748a4.22 4.22 0 0 0-2.227 4.086a4.46 4.46 0 0 0 2.744 3.828a.4.4 0 0 1 0 .094a11.8 11.8 0 0 1-2.45 4.11a3.12 3.12 0 0 1-1.66 1.06a2.9 2.9 0 0 1-1.448-.118c-.495-.153-.978-.353-1.484-.495a4.23 4.23 0 0 0-2.661.236q-.644.235-1.308.4a2 2 0 0 1-1.566-.294a5.9 5.9 0 0 1-1.413-1.284a12.4 12.4 0 0 1-2.673-5.994a7.54 7.54 0 0 1 .435-4.44a5.06 5.06 0 0 1 3.734-3.062a4.26 4.26 0 0 1 2.272.189l1.555.53c.273.105.575.105.848 0a19 19 0 0 1 2.014-.648a4.86 4.86 0 0 1 5.11 1.59z"/><path fill="currentColor" d="M16.191 2a3.9 3.9 0 0 1-.235 1.814a4.93 4.93 0 0 1-2.143 2.496a3.1 3.1 0 0 1-1.614.436c-.153 0-.188 0-.2-.2a4.18 4.18 0 0 1 .907-2.709a4.7 4.7 0 0 1 3.05-1.813z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M19.89 8.748a4.22 4.22 0 0 0-2.227 4.086a4.46 4.46 0 0 0 2.744 3.828a.4.4 0 0 1 0 .094a11.8 11.8 0 0 1-2.45 4.11a3.12 3.12 0 0 1-1.66 1.06a2.9 2.9 0 0 1-1.448-.118c-.495-.153-.978-.353-1.484-.495a4.23 4.23 0 0 0-2.661.236q-.644.235-1.308.4a2 2 0 0 1-1.566-.294a5.9 5.9 0 0 1-1.413-1.284a12.4 12.4 0 0 1-2.673-5.994a7.54 7.54 0 0 1 .435-4.44a5.06 5.06 0 0 1 3.734-3.062a4.26 4.26 0 0 1 2.272.189l1.555.53c.273.105.575.105.848 0a19 19 0 0 1 2.014-.648a4.86 4.86 0 0 1 5.11 1.59z"/><path fill="currentColor" d="M16.191 2a3.9 3.9 0 0 1-.235 1.814a4.93 4.93 0 0 1-2.143 2.496a3.1 3.1 0 0 1-1.614.436c-.153 0-.188 0-.2-.2a4.18 4.18 0 0 1 .907-2.709a4.7 4.7 0 0 1 3.05-1.813z"/></svg>
</template>

CSS

.icon-apple {
  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%22M19.89%208.748a4.22%204.22%200%200%200-2.227%204.086a4.46%204.46%200%200%200%202.744%203.828a.4.4%200%200%201%200%20.094a11.8%2011.8%200%200%201-2.45%204.11a3.12%203.12%200%200%201-1.66%201.06a2.9%202.9%200%200%201-1.448-.118c-.495-.153-.978-.353-1.484-.495a4.23%204.23%200%200%200-2.661.236q-.644.235-1.308.4a2%202%200%200%201-1.566-.294a5.9%205.9%200%200%201-1.413-1.284a12.4%2012.4%200%200%201-2.673-5.994a7.54%207.54%200%200%201%20.435-4.44a5.06%205.06%200%200%201%203.734-3.062a4.26%204.26%200%200%201%202.272.189l1.555.53c.273.105.575.105.848%200a19%2019%200%200%201%202.014-.648a4.86%204.86%200%200%201%205.11%201.59z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M16.191%202a3.9%203.9%200%200%201-.235%201.814a4.93%204.93%200%200%201-2.143%202.496a3.1%203.1%200%200%201-1.614.436c-.153%200-.188%200-.2-.2a4.18%204.18%200%200%201%20.907-2.709a4.7%204.7%200%200%201%203.05-1.813z%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%22M19.89%208.748a4.22%204.22%200%200%200-2.227%204.086a4.46%204.46%200%200%200%202.744%203.828a.4.4%200%200%201%200%20.094a11.8%2011.8%200%200%201-2.45%204.11a3.12%203.12%200%200%201-1.66%201.06a2.9%202.9%200%200%201-1.448-.118c-.495-.153-.978-.353-1.484-.495a4.23%204.23%200%200%200-2.661.236q-.644.235-1.308.4a2%202%200%200%201-1.566-.294a5.9%205.9%200%200%201-1.413-1.284a12.4%2012.4%200%200%201-2.673-5.994a7.54%207.54%200%200%201%20.435-4.44a5.06%205.06%200%200%201%203.734-3.062a4.26%204.26%200%200%201%202.272.189l1.555.53c.273.105.575.105.848%200a19%2019%200%200%201%202.014-.648a4.86%204.86%200%200%201%205.11%201.59z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M16.191%202a3.9%203.9%200%200%201-.235%201.814a4.93%204.93%200%200%201-2.143%202.496a3.1%203.1%200%200%201-1.614.436c-.153%200-.188%200-.2-.2a4.18%204.18%200%200%201%20.907-2.709a4.7%204.7%200%200%201%203.05-1.813z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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