volume mute icon

volume-mute-sharp from IonIcons by Ben Sperry · Sharp · MIT Free for personal and commercial use.

Name
volume-mute-sharp
Set
IonIcons
Style
Sharp
Viewbox
512×512
License
MIT

2 other variants in IonIcons

The same icon in other sets

Related icons in IonIcons

Use the volume mute icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="32" d="M416 432L64 80"/><path fill="currentColor" d="M352 256c0-24.56-5.81-47.88-17.75-71.27L327 170.47L298.48 185l7.27 14.25C315.34 218.06 320 236.62 320 256a113 113 0 0 1-.63 11.74l27.32 27.32A148.8 148.8 0 0 0 352 256m64 0c0-51.19-13.08-83.89-34.18-120.06l-8.06-13.82l-27.64 16.12l8.06 13.82C373.07 184.44 384 211.83 384 256c0 25.93-3.89 46.21-11 65.33l24.5 24.51C409.19 319.68 416 292.42 416 256"/><path fill="currentColor" d="M480 256c0-74.26-20.19-121.11-50.51-168.61l-8.61-13.49l-27 17.22l8.61 13.49C429.82 147.38 448 189.5 448 256c0 48.76-9.4 84-24.82 115.55l23.7 23.7C470.16 351.39 480 309 480 256M256 72l-73.6 58.78l73.6 73.59zM32 176.1v159.8h93.65L256 440V339.63L92.47 176.1z"/></svg>

React

import type { SVGProps } from "react";

export function IonVolumeMuteSharp(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" strokeLinecap="square" strokeMiterlimit="10" strokeWidth="32" d="M416 432L64 80"/><path fill="currentColor" d="M352 256c0-24.56-5.81-47.88-17.75-71.27L327 170.47L298.48 185l7.27 14.25C315.34 218.06 320 236.62 320 256a113 113 0 0 1-.63 11.74l27.32 27.32A148.8 148.8 0 0 0 352 256m64 0c0-51.19-13.08-83.89-34.18-120.06l-8.06-13.82l-27.64 16.12l8.06 13.82C373.07 184.44 384 211.83 384 256c0 25.93-3.89 46.21-11 65.33l24.5 24.51C409.19 319.68 416 292.42 416 256"/><path fill="currentColor" d="M480 256c0-74.26-20.19-121.11-50.51-168.61l-8.61-13.49l-27 17.22l8.61 13.49C429.82 147.38 448 189.5 448 256c0 48.76-9.4 84-24.82 115.55l23.7 23.7C470.16 351.39 480 309 480 256M256 72l-73.6 58.78l73.6 73.59zM32 176.1v159.8h93.65L256 440V339.63L92.47 176.1z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="32" d="M416 432L64 80"/><path fill="currentColor" d="M352 256c0-24.56-5.81-47.88-17.75-71.27L327 170.47L298.48 185l7.27 14.25C315.34 218.06 320 236.62 320 256a113 113 0 0 1-.63 11.74l27.32 27.32A148.8 148.8 0 0 0 352 256m64 0c0-51.19-13.08-83.89-34.18-120.06l-8.06-13.82l-27.64 16.12l8.06 13.82C373.07 184.44 384 211.83 384 256c0 25.93-3.89 46.21-11 65.33l24.5 24.51C409.19 319.68 416 292.42 416 256"/><path fill="currentColor" d="M480 256c0-74.26-20.19-121.11-50.51-168.61l-8.61-13.49l-27 17.22l8.61 13.49C429.82 147.38 448 189.5 448 256c0 48.76-9.4 84-24.82 115.55l23.7 23.7C470.16 351.39 480 309 480 256M256 72l-73.6 58.78l73.6 73.59zM32 176.1v159.8h93.65L256 440V339.63L92.47 176.1z"/></svg>
</template>

CSS

.icon-volume-mute-sharp {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%2232%22%20d%3D%22M416%20432L64%2080%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M352%20256c0-24.56-5.81-47.88-17.75-71.27L327%20170.47L298.48%20185l7.27%2014.25C315.34%20218.06%20320%20236.62%20320%20256a113%20113%200%200%201-.63%2011.74l27.32%2027.32A148.8%20148.8%200%200%200%20352%20256m64%200c0-51.19-13.08-83.89-34.18-120.06l-8.06-13.82l-27.64%2016.12l8.06%2013.82C373.07%20184.44%20384%20211.83%20384%20256c0%2025.93-3.89%2046.21-11%2065.33l24.5%2024.51C409.19%20319.68%20416%20292.42%20416%20256%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M480%20256c0-74.26-20.19-121.11-50.51-168.61l-8.61-13.49l-27%2017.22l8.61%2013.49C429.82%20147.38%20448%20189.5%20448%20256c0%2048.76-9.4%2084-24.82%20115.55l23.7%2023.7C470.16%20351.39%20480%20309%20480%20256M256%2072l-73.6%2058.78l73.6%2073.59zM32%20176.1v159.8h93.65L256%20440V339.63L92.47%20176.1z%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%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%2232%22%20d%3D%22M416%20432L64%2080%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M352%20256c0-24.56-5.81-47.88-17.75-71.27L327%20170.47L298.48%20185l7.27%2014.25C315.34%20218.06%20320%20236.62%20320%20256a113%20113%200%200%201-.63%2011.74l27.32%2027.32A148.8%20148.8%200%200%200%20352%20256m64%200c0-51.19-13.08-83.89-34.18-120.06l-8.06-13.82l-27.64%2016.12l8.06%2013.82C373.07%20184.44%20384%20211.83%20384%20256c0%2025.93-3.89%2046.21-11%2065.33l24.5%2024.51C409.19%20319.68%20416%20292.42%20416%20256%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M480%20256c0-74.26-20.19-121.11-50.51-168.61l-8.61-13.49l-27%2017.22l8.61%2013.49C429.82%20147.38%20448%20189.5%20448%20256c0%2048.76-9.4%2084-24.82%20115.55l23.7%2023.7C470.16%20351.39%20480%20309%20480%20256M256%2072l-73.6%2058.78l73.6%2073.59zM32%20176.1v159.8h93.65L256%20440V339.63L92.47%20176.1z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/volume-mute-sharp.svg?color=%231a73e8&size=48