Airpods icon
icon-park:airpods
The Airpods icon (icon-park:airpods) is a free SVG icon from the IconPark set by ByteDance. It is drawn on a 48 × 48 grid. IconPark icons are released under the Apache 2.0 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
- IconPark
- Author
- ByteDance
- License
- Apache-2.0
- Size
- 48 × 48
- Category
- Music
- Tags
- airpod
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" stroke="#000" d="M36 4C31.0294 4 27 8.02944 27 13V44H33V21.4879C33.9383 21.8195 34.9481 22 36 22C39.4829 22 42.5038 20.0216 44 17.1272V8.8728C42.5038 5.97844 39.4829 4 36 4Z"/><path fill="#2F88FF" stroke="#000" d="M12 4C16.9706 4 21 8.02944 21 13V44H15V21.4879C14.0617 21.8195 13.0519 22 12 22C8.51707 22 5.49623 20.0216 4 17.1272V8.8728C5.49623 5.97844 8.51707 4 12 4Z"/><path stroke="#fff" d="M15 13H14"/><path stroke="#fff" d="M33 13H34"/></g></svg>How to use the Airpods icon
React
import { Icon } from "@iconify/react";
<Icon icon="icon-park:airpods" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="icon-park:airpods" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="icon-park:airpods" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--airpods]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:airpods"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="icon-park:airpods"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/icon-park/airpods.svg" alt="Airpods icon" width="24" height="24">Airpods icon in other icon sets
Airpods icon FAQ
Is the Airpods icon free for commercial use?
Yes. IconPark icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.
How do I use the Airpods icon in React?
Install @iconify/react and render <Icon icon="icon-park:airpods" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Airpods icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/icon-park/airpods.svg" alt="Airpods icon">, or paste the SVG code inline to style it with CSS.