Apple icon
Download the Apple logo as free SVG or PNG. Compare outline and filled styles. Copy React, Vue or Svelte code.
- apple
- mac
- macos
- ios
- iphone
- ipad
- company
- tech
- logo
- brand
Style
Size
Stroke
Filled icons have no stroke
Color
- Category
- brand
- Styles
- Outline, filled
- Component
- IconBrandApple
- License
- MIT · Paweł Kuna
Code
Copy it the way you use it
brand-apple.svg
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M8.286 7.008c-3.216 0 -4.286 3.23 -4.286 5.92c0 3.229 2.143 8.072 4.286 8.072c1.165 -.05 1.799 -.538 3.214 -.538c1.406 0 1.607 .538 3.214 .538s4.286 -3.229 4.286 -5.381c-.03 -.011 -2.649 -.434 -2.679 -3.23c-.02 -2.335 2.589 -3.179 2.679 -3.228c-1.096 -1.606 -3.162 -2.113 -3.75 -2.153c-1.535 -.12 -3.032 1.077 -3.75 1.077c-.729 0 -2.036 -1.077 -3.214 -1.077" />
<path d="M12 4a2 2 0 0 0 2 -2a2 2 0 0 0 -2 2" />
</svg> Use the Apple icon
For a decorative icon beside text, add aria-hidden="true" to the SVG. For an icon-only control, put its accessible name on the button or link.
React example
import { IconBrandApple } from '@tabler/icons-react';
<IconBrandApple size={24} stroke={2} />Read the React guideVue example
import { IconBrandApple } from '@tabler/icons-vue';
<IconBrandApple :size="24" :stroke="2" />Read the Vue guideSvelte 5 example
import { IconBrandApple } from '@tabler/icons-svelte-runes';
<IconBrandApple size={24} stroke={2} />Read the Svelte guideCompare variants and alternatives
Related