Hover the icon or press Play. Suggested motion: ring. Pick another to preview it and update the animated code:
Headphones icon
A free headphones icon from Typicons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.
- License
- CC BY-SA 3.0 license
- Project
- s-ings.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/typicons/headphones.jsonimport * as React from "react";
/**
* Headphones from Typicons (http://s-ings.com/typicons/), CC BY-SA 3.0.
* Via Cuelark UI: ui.cuelark.com/icons/typicons/headphones. Sized in em, colored by currentColor.
*/
export function TiHeadphonesIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
version="1.2"
baseProfile="tiny"
viewBox="0 0 24 24"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M21 13c0-4.963-4.037-9-9-9s-9 4.037-9 9v2.6l.023.113c-.013.243-.023.5-.023.787v2c0 1.93 1.57 3.5 3.5 3.5s3.5-1.57 3.5-3.5v-2c0-1.511-.83-2.79-1.982-3.278.095-2.122 1.837-3.823 3.982-3.823s3.887 1.7 3.982 3.822c-1.152.49-1.982 1.768-1.982 3.279v2c0 1.93 1.57 3.5 3.5 3.5s3.5-1.57 3.5-3.5v-2c0-.287-.01-.544-.023-.787l.023-.113v-2.6zm-16 0c0-1.586.538-3.046 1.432-4.221l.89.889c-.742.928-1.218 2.075-1.302 3.332-.02 0-.02 1-.02 1h-1v-1zm3 5.5c0 .827-.673 1.5-1.5 1.5s-1.5-.673-1.5-1.5v-2c0-.666.057-1.176.114-1.5h1.886c.473 0 1 .616 1 1.5v2zm7.77-9.338l-.354.354c-.912-.913-2.125-1.416-3.416-1.416s-2.504.503-3.417 1.416l-.354-.354-1.141-1.141-.627-.626c1.479-1.48 3.447-2.295 5.539-2.295 2.093 0 4.06.815 5.539 2.295l-.627.626-1.142 1.141zm3.23 9.338c0 .827-.673 1.5-1.5 1.5s-1.5-.673-1.5-1.5v-2c0-.884.527-1.5 1-1.5h1.886c.057.324.114.834.114 1.5v2zm0-4.5h-1v-1c-.104-1.257-.58-2.404-1.322-3.332l.891-.889c.893 1.175 1.431 2.634 1.431 4.221v1z"
/>
</svg>
);
}import { TiHeadphones } from "react-icons/ti";
export function Example() {
return <TiHeadphones className="size-5" />;
}<svg
version="1.2"
baseProfile="tiny"
viewBox="0 0 24 24"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 13c0-4.963-4.037-9-9-9s-9 4.037-9 9v2.6l.023.113c-.013.243-.023.5-.023.787v2c0 1.93 1.57 3.5 3.5 3.5s3.5-1.57 3.5-3.5v-2c0-1.511-.83-2.79-1.982-3.278.095-2.122 1.837-3.823 3.982-3.823s3.887 1.7 3.982 3.822c-1.152.49-1.982 1.768-1.982 3.279v2c0 1.93 1.57 3.5 3.5 3.5s3.5-1.57 3.5-3.5v-2c0-.287-.01-.544-.023-.787l.023-.113v-2.6zm-16 0c0-1.586.538-3.046 1.432-4.221l.89.889c-.742.928-1.218 2.075-1.302 3.332-.02 0-.02 1-.02 1h-1v-1zm3 5.5c0 .827-.673 1.5-1.5 1.5s-1.5-.673-1.5-1.5v-2c0-.666.057-1.176.114-1.5h1.886c.473 0 1 .616 1 1.5v2zm7.77-9.338l-.354.354c-.912-.913-2.125-1.416-3.416-1.416s-2.504.503-3.417 1.416l-.354-.354-1.141-1.141-.627-.626c1.479-1.48 3.447-2.295 5.539-2.295 2.093 0 4.06.815 5.539 2.295l-.627.626-1.142 1.141zm3.23 9.338c0 .827-.673 1.5-1.5 1.5s-1.5-.673-1.5-1.5v-2c0-.884.527-1.5 1-1.5h1.886c.057.324.114.834.114 1.5v2zm0-4.5h-1v-1c-.104-1.257-.58-2.404-1.322-3.332l.891-.889c.893 1.175 1.431 2.634 1.431 4.221v1z"
/>
</svg>"Headphones" icon from Typicons (http://s-ings.com/typicons/), licensed under CC BY-SA 3.0 license.