Hover the icon or press Play. Suggested motion: bounce. Pick another to preview it and update the animated code:

Simple Line Icons · SlMusicToneAlt

Music Tone Alt icon

A free music tone alt icon from Simple Line Icons, 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.

Also known asaudio icon sound icon song icon note icon melody icon headphones icon headset icon support icon

License: MIT license
Project: thesabbir.github.io

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/simple-line-icons/music-tone-alt.json

components/icons/simple-line-icons-music-tone-alt.tsx

import * as React from "react";

/**
 * Music Tone Alt from Simple Line Icons (https://thesabbir.github.io/simple-line-icons/), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/simple-line-icons/music-tone-alt. Sized in em, colored by currentColor.
 */
export function SlMusicToneAltIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 1024 1024"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M991.728 705.408c.016-.56.16-1.071.16-1.63V36.752c.384-3.504.256-7.12-.576-10.752C988.576 11.09 975.583-.222 959.887-.222c-5.888 0-11.344 1.696-16.08 4.48L345.935 159.906c-10.768 2.672-18.752 10.72-22.032 20.672-2.48 4.544-4 9.664-4 15.2v572.544c-30.464-20.384-69.408-32.656-111.872-32.656-97.536 0-176.64 64.608-176.64 144.272 0 79.68 79.103 144.304 176.64 144.304 97.568 0 176.608-64.608 176.608-144.305 0-4.065-.336-8.065-.736-12.049V216.144l544-141.6v533.76c-30.449-20.383-69.409-32.656-111.872-32.656-97.537 0-176.64 64.624-176.64 144.272 0 79.68 79.103 144.304 176.64 144.304 97.568 0 176.608-64.608 176.608-144.305-.016-4.912-.32-9.744-.912-14.511zM208.704 959.952c-66.56 0-112.961-42.191-112.961-79.999 0-37.824 46.384-79.952 112.96-79.952 59.232 0 102.4 33.392 111.185 67.407v.368c0 3.233.624 6.289 1.52 9.216.065.992.225 1.968.225 2.96 0 37.808-46.4 80-112.929 80zm606.991-159.999c-65.968 0-111.953-42.176-111.953-80s45.984-79.952 111.952-79.952c65.952 0 111.937 42.128 111.937 79.952s-45.968 80-111.936 80z"
      />
    </svg>
  );
}

With react-icons

import { SlMusicToneAlt } from "react-icons/sl";

export function Example() {
  return <SlMusicToneAlt className="size-5" />;
}

music-tone-alt.svg

<svg
  viewBox="0 0 1024 1024"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M991.728 705.408c.016-.56.16-1.071.16-1.63V36.752c.384-3.504.256-7.12-.576-10.752C988.576 11.09 975.583-.222 959.887-.222c-5.888 0-11.344 1.696-16.08 4.48L345.935 159.906c-10.768 2.672-18.752 10.72-22.032 20.672-2.48 4.544-4 9.664-4 15.2v572.544c-30.464-20.384-69.408-32.656-111.872-32.656-97.536 0-176.64 64.608-176.64 144.272 0 79.68 79.103 144.304 176.64 144.304 97.568 0 176.608-64.608 176.608-144.305 0-4.065-.336-8.065-.736-12.049V216.144l544-141.6v533.76c-30.449-20.383-69.409-32.656-111.872-32.656-97.537 0-176.64 64.624-176.64 144.272 0 79.68 79.103 144.304 176.64 144.304 97.568 0 176.608-64.608 176.608-144.305-.016-4.912-.32-9.744-.912-14.511zM208.704 959.952c-66.56 0-112.961-42.191-112.961-79.999 0-37.824 46.384-79.952 112.96-79.952 59.232 0 102.4 33.392 111.185 67.407v.368c0 3.233.624 6.289 1.52 9.216.065.992.225 1.968.225 2.96 0 37.808-46.4 80-112.929 80zm606.991-159.999c-65.968 0-111.953-42.176-111.953-80s45.984-79.952 111.952-79.952c65.952 0 111.937 42.128 111.937 79.952s-45.968 80-111.936 80z"
  />
</svg>

Attribution

"Music Tone Alt" icon from Simple Line Icons (https://thesabbir.github.io/simple-line-icons/), licensed under MIT license.

Related icons: audio, sound, song, note

Similar Simple Line Icons icons