waveform icon
waveform from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- waveform
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
The same icon in other sets
Related icons in Framework7 Icons
Use the waveform icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M24.59 49.574c.96 0 1.664-.726 1.664-1.64V8.066c0-.914-.703-1.64-1.664-1.64c-.938 0-1.64.726-1.64 1.64v39.868c0 .914.702 1.64 1.64 1.64m13.64-4.687c.938 0 1.641-.75 1.641-1.664V12.777c0-.914-.703-1.664-1.64-1.664c-.938 0-1.665.75-1.665 1.664v30.446c0 .914.727 1.664 1.664 1.664M17.793 41.09c.938 0 1.64-.727 1.64-1.64v-22.9c0-.913-.703-1.64-1.64-1.64c-.961 0-1.664.727-1.664 1.64v22.9c0 .913.703 1.64 1.664 1.64m13.617-2.531c.938 0 1.664-.727 1.664-1.641V19.082c0-.914-.726-1.64-1.664-1.64s-1.64.726-1.64 1.64v17.836c0 .914.703 1.64 1.64 1.64m13.64-4.196c.938 0 1.641-.75 1.641-1.664V23.3c0-.914-.703-1.664-1.64-1.664a1.64 1.64 0 0 0-1.664 1.664v9.398a1.64 1.64 0 0 0 1.664 1.664m-34.077-1.851c.937 0 1.64-.727 1.64-1.64v-5.743c0-.914-.703-1.64-1.64-1.64c-.961 0-1.664.726-1.664 1.64v5.742c0 .914.703 1.64 1.664 1.64"/></svg>
React
import type { SVGProps } from "react";
export function F7Waveform(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M24.59 49.574c.96 0 1.664-.726 1.664-1.64V8.066c0-.914-.703-1.64-1.664-1.64c-.938 0-1.64.726-1.64 1.64v39.868c0 .914.702 1.64 1.64 1.64m13.64-4.687c.938 0 1.641-.75 1.641-1.664V12.777c0-.914-.703-1.664-1.64-1.664c-.938 0-1.665.75-1.665 1.664v30.446c0 .914.727 1.664 1.664 1.664M17.793 41.09c.938 0 1.64-.727 1.64-1.64v-22.9c0-.913-.703-1.64-1.64-1.64c-.961 0-1.664.727-1.664 1.64v22.9c0 .913.703 1.64 1.664 1.64m13.617-2.531c.938 0 1.664-.727 1.664-1.641V19.082c0-.914-.726-1.64-1.664-1.64s-1.64.726-1.64 1.64v17.836c0 .914.703 1.64 1.64 1.64m13.64-4.196c.938 0 1.641-.75 1.641-1.664V23.3c0-.914-.703-1.664-1.64-1.664a1.64 1.64 0 0 0-1.664 1.664v9.398a1.64 1.64 0 0 0 1.664 1.664m-34.077-1.851c.937 0 1.64-.727 1.64-1.64v-5.743c0-.914-.703-1.64-1.64-1.64c-.961 0-1.664.726-1.664 1.64v5.742c0 .914.703 1.64 1.664 1.64"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M24.59 49.574c.96 0 1.664-.726 1.664-1.64V8.066c0-.914-.703-1.64-1.664-1.64c-.938 0-1.64.726-1.64 1.64v39.868c0 .914.702 1.64 1.64 1.64m13.64-4.687c.938 0 1.641-.75 1.641-1.664V12.777c0-.914-.703-1.664-1.64-1.664c-.938 0-1.665.75-1.665 1.664v30.446c0 .914.727 1.664 1.664 1.664M17.793 41.09c.938 0 1.64-.727 1.64-1.64v-22.9c0-.913-.703-1.64-1.64-1.64c-.961 0-1.664.727-1.664 1.64v22.9c0 .913.703 1.64 1.664 1.64m13.617-2.531c.938 0 1.664-.727 1.664-1.641V19.082c0-.914-.726-1.64-1.664-1.64s-1.64.726-1.64 1.64v17.836c0 .914.703 1.64 1.64 1.64m13.64-4.196c.938 0 1.641-.75 1.641-1.664V23.3c0-.914-.703-1.664-1.64-1.664a1.64 1.64 0 0 0-1.664 1.664v9.398a1.64 1.64 0 0 0 1.664 1.664m-34.077-1.851c.937 0 1.64-.727 1.64-1.64v-5.743c0-.914-.703-1.64-1.64-1.64c-.961 0-1.664.726-1.664 1.64v5.742c0 .914.703 1.64 1.664 1.64"/></svg> </template>
CSS
.icon-waveform {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M24.59%2049.574c.96%200%201.664-.726%201.664-1.64V8.066c0-.914-.703-1.64-1.664-1.64c-.938%200-1.64.726-1.64%201.64v39.868c0%20.914.702%201.64%201.64%201.64m13.64-4.687c.938%200%201.641-.75%201.641-1.664V12.777c0-.914-.703-1.664-1.64-1.664c-.938%200-1.665.75-1.665%201.664v30.446c0%20.914.727%201.664%201.664%201.664M17.793%2041.09c.938%200%201.64-.727%201.64-1.64v-22.9c0-.913-.703-1.64-1.64-1.64c-.961%200-1.664.727-1.664%201.64v22.9c0%20.913.703%201.64%201.664%201.64m13.617-2.531c.938%200%201.664-.727%201.664-1.641V19.082c0-.914-.726-1.64-1.664-1.64s-1.64.726-1.64%201.64v17.836c0%20.914.703%201.64%201.64%201.64m13.64-4.196c.938%200%201.641-.75%201.641-1.664V23.3c0-.914-.703-1.664-1.64-1.664a1.64%201.64%200%200%200-1.664%201.664v9.398a1.64%201.64%200%200%200%201.664%201.664m-34.077-1.851c.937%200%201.64-.727%201.64-1.64v-5.743c0-.914-.703-1.64-1.64-1.64c-.961%200-1.664.726-1.664%201.64v5.742c0%20.914.703%201.64%201.664%201.64%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M24.59%2049.574c.96%200%201.664-.726%201.664-1.64V8.066c0-.914-.703-1.64-1.664-1.64c-.938%200-1.64.726-1.64%201.64v39.868c0%20.914.702%201.64%201.64%201.64m13.64-4.687c.938%200%201.641-.75%201.641-1.664V12.777c0-.914-.703-1.664-1.64-1.664c-.938%200-1.665.75-1.665%201.664v30.446c0%20.914.727%201.664%201.664%201.664M17.793%2041.09c.938%200%201.64-.727%201.64-1.64v-22.9c0-.913-.703-1.64-1.64-1.64c-.961%200-1.664.727-1.664%201.64v22.9c0%20.913.703%201.64%201.664%201.64m13.617-2.531c.938%200%201.664-.727%201.664-1.641V19.082c0-.914-.726-1.64-1.664-1.64s-1.64.726-1.64%201.64v17.836c0%20.914.703%201.64%201.64%201.64m13.64-4.196c.938%200%201.641-.75%201.641-1.664V23.3c0-.914-.703-1.664-1.64-1.664a1.64%201.64%200%200%200-1.664%201.664v9.398a1.64%201.64%200%200%200%201.664%201.664m-34.077-1.851c.937%200%201.64-.727%201.64-1.64v-5.743c0-.914-.703-1.64-1.64-1.64c-.961%200-1.664.726-1.664%201.64v5.742c0%20.914.703%201.64%201.664%201.64%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/waveform.svg?color=%231a73e8&size=48
