waveform path icon
waveform-path from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- waveform-path
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
Related icons in Framework7 Icons
Use the waveform path icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M1.644 32.55h6.689c.616 0 1.187-.366 1.347-1.028l.662-2.945l3.219 14.907c.296 1.37 2.534 1.37 2.74-.022l2.784-18.31l3.265 28.24c.205 1.69 2.625 1.667 2.762 0l3.014-33.673l2.99 33.65c.16 1.713 2.557 1.713 2.763 0l3.264-28.216l2.808 18.332c.206 1.392 2.42 1.392 2.74 0l3.173-14.725l.685 2.762c.205.753.73 1.027 1.347 1.027h6.483c.914 0 1.621-.707 1.621-1.598c0-.89-.707-1.62-1.62-1.62H48.9l-1.826-7.078c-.41-1.53-2.397-1.53-2.717 0l-2.83 13.333l-3.22-21.026c-.25-1.667-2.556-1.621-2.762.023L32.67 39.535L29.52 3.921c-.138-1.712-2.649-1.712-2.809 0l-3.15 35.614l-2.877-24.952c-.182-1.69-2.488-1.69-2.762-.023l-3.219 21.026l-2.808-13.333c-.32-1.415-2.351-1.415-2.74 0L7.329 29.33H1.644C.73 29.33 0 30.06 0 30.951c0 .89.73 1.598 1.644 1.598"/></svg>
React
import type { SVGProps } from "react";
export function F7WaveformPath(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="M1.644 32.55h6.689c.616 0 1.187-.366 1.347-1.028l.662-2.945l3.219 14.907c.296 1.37 2.534 1.37 2.74-.022l2.784-18.31l3.265 28.24c.205 1.69 2.625 1.667 2.762 0l3.014-33.673l2.99 33.65c.16 1.713 2.557 1.713 2.763 0l3.264-28.216l2.808 18.332c.206 1.392 2.42 1.392 2.74 0l3.173-14.725l.685 2.762c.205.753.73 1.027 1.347 1.027h6.483c.914 0 1.621-.707 1.621-1.598c0-.89-.707-1.62-1.62-1.62H48.9l-1.826-7.078c-.41-1.53-2.397-1.53-2.717 0l-2.83 13.333l-3.22-21.026c-.25-1.667-2.556-1.621-2.762.023L32.67 39.535L29.52 3.921c-.138-1.712-2.649-1.712-2.809 0l-3.15 35.614l-2.877-24.952c-.182-1.69-2.488-1.69-2.762-.023l-3.219 21.026l-2.808-13.333c-.32-1.415-2.351-1.415-2.74 0L7.329 29.33H1.644C.73 29.33 0 30.06 0 30.951c0 .89.73 1.598 1.644 1.598"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M1.644 32.55h6.689c.616 0 1.187-.366 1.347-1.028l.662-2.945l3.219 14.907c.296 1.37 2.534 1.37 2.74-.022l2.784-18.31l3.265 28.24c.205 1.69 2.625 1.667 2.762 0l3.014-33.673l2.99 33.65c.16 1.713 2.557 1.713 2.763 0l3.264-28.216l2.808 18.332c.206 1.392 2.42 1.392 2.74 0l3.173-14.725l.685 2.762c.205.753.73 1.027 1.347 1.027h6.483c.914 0 1.621-.707 1.621-1.598c0-.89-.707-1.62-1.62-1.62H48.9l-1.826-7.078c-.41-1.53-2.397-1.53-2.717 0l-2.83 13.333l-3.22-21.026c-.25-1.667-2.556-1.621-2.762.023L32.67 39.535L29.52 3.921c-.138-1.712-2.649-1.712-2.809 0l-3.15 35.614l-2.877-24.952c-.182-1.69-2.488-1.69-2.762-.023l-3.219 21.026l-2.808-13.333c-.32-1.415-2.351-1.415-2.74 0L7.329 29.33H1.644C.73 29.33 0 30.06 0 30.951c0 .89.73 1.598 1.644 1.598"/></svg> </template>
CSS
.icon-waveform-path {
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%22M1.644%2032.55h6.689c.616%200%201.187-.366%201.347-1.028l.662-2.945l3.219%2014.907c.296%201.37%202.534%201.37%202.74-.022l2.784-18.31l3.265%2028.24c.205%201.69%202.625%201.667%202.762%200l3.014-33.673l2.99%2033.65c.16%201.713%202.557%201.713%202.763%200l3.264-28.216l2.808%2018.332c.206%201.392%202.42%201.392%202.74%200l3.173-14.725l.685%202.762c.205.753.73%201.027%201.347%201.027h6.483c.914%200%201.621-.707%201.621-1.598c0-.89-.707-1.62-1.62-1.62H48.9l-1.826-7.078c-.41-1.53-2.397-1.53-2.717%200l-2.83%2013.333l-3.22-21.026c-.25-1.667-2.556-1.621-2.762.023L32.67%2039.535L29.52%203.921c-.138-1.712-2.649-1.712-2.809%200l-3.15%2035.614l-2.877-24.952c-.182-1.69-2.488-1.69-2.762-.023l-3.219%2021.026l-2.808-13.333c-.32-1.415-2.351-1.415-2.74%200L7.329%2029.33H1.644C.73%2029.33%200%2030.06%200%2030.951c0%20.89.73%201.598%201.644%201.598%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%22M1.644%2032.55h6.689c.616%200%201.187-.366%201.347-1.028l.662-2.945l3.219%2014.907c.296%201.37%202.534%201.37%202.74-.022l2.784-18.31l3.265%2028.24c.205%201.69%202.625%201.667%202.762%200l3.014-33.673l2.99%2033.65c.16%201.713%202.557%201.713%202.763%200l3.264-28.216l2.808%2018.332c.206%201.392%202.42%201.392%202.74%200l3.173-14.725l.685%202.762c.205.753.73%201.027%201.347%201.027h6.483c.914%200%201.621-.707%201.621-1.598c0-.89-.707-1.62-1.62-1.62H48.9l-1.826-7.078c-.41-1.53-2.397-1.53-2.717%200l-2.83%2013.333l-3.22-21.026c-.25-1.667-2.556-1.621-2.762.023L32.67%2039.535L29.52%203.921c-.138-1.712-2.649-1.712-2.809%200l-3.15%2035.614l-2.877-24.952c-.182-1.69-2.488-1.69-2.762-.023l-3.219%2021.026l-2.808-13.333c-.32-1.415-2.351-1.415-2.74%200L7.329%2029.33H1.644C.73%2029.33%200%2030.06%200%2030.951c0%20.89.73%201.598%201.644%201.598%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/waveform-path.svg?color=%231a73e8&size=48
