music notes icon
music-notes from Reicon by REICON · Outline · Video · MIT Free for personal and commercial use.
- Name
- music-notes
- Set
- Reicon
- Style
- Outline
- Category
- Video
- Viewbox
- 24×24
- License
- MIT
2 other variants in Reicon
The same icon in other sets
More video icons from Reicon
albumcameracamera-addcamera-add2camera-altcamera-offcamera-recordcamera-rotatecamera-squarecamera2camera3clapperboardclapperboard-editclapperboard-openclapperboard-open-playclapperboard-playclapperboard-textexit-fullscreenexit-fullscreen-circleexit-fullscreen-squareexit-pipfast-forwardfast-forward-circlefilm
Use the music notes icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M8.512 3.698A2.44 2.44 0 0 0 10 4.25a.75.75 0 0 1 0 1.5c-.72 0-1.551-.24-2.25-.745V11c0 .16-.05.307-.135.429A3.252 3.252 0 0 1 1.25 10.5a3.25 3.25 0 0 1 5-2.74V2h1.5c0 .798.328 1.34.762 1.698M6.25 10.5a1.75 1.75 0 1 0-3.5 0a1.75 1.75 0 0 0 3.5 0m13.323-6.559c-.672.171-1.552.537-2.828 1.071l-2 .838c-.61.255-1.012.424-1.308.588c-.28.154-.4.27-.478.386s-.137.272-.171.59c-.037.336-.038.772-.038 1.434v2.044l8.5-3.4c-.002-1.108-.015-1.907-.103-2.503c-.1-.672-.27-.901-.454-1.024c-.185-.123-.463-.191-1.12-.024m3.177 4.042v-.035c0-1.306 0-2.37-.12-3.179c-.123-.836-.4-1.582-1.106-2.053c-.708-.47-1.503-.437-2.322-.228c-.792.201-1.774.612-2.978 1.116l-2.094.877c-.565.236-1.043.436-1.418.644c-.4.22-.743.48-1.001.868s-.366.805-.415 1.259c-.046.426-.046.944-.046 1.556v7.953A3.25 3.25 0 1 0 12.712 19h.038v-6.493l8.5-3.4v5.653a3.25 3.25 0 1 0 1.482 2.393h.018zM19.5 15.75a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5m-10 2a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5" clip-rule="evenodd"/></svg>
React
import type { SVGProps } from "react";
export function ReiconMusicNotes(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fillRule="evenodd" d="M8.512 3.698A2.44 2.44 0 0 0 10 4.25a.75.75 0 0 1 0 1.5c-.72 0-1.551-.24-2.25-.745V11c0 .16-.05.307-.135.429A3.252 3.252 0 0 1 1.25 10.5a3.25 3.25 0 0 1 5-2.74V2h1.5c0 .798.328 1.34.762 1.698M6.25 10.5a1.75 1.75 0 1 0-3.5 0a1.75 1.75 0 0 0 3.5 0m13.323-6.559c-.672.171-1.552.537-2.828 1.071l-2 .838c-.61.255-1.012.424-1.308.588c-.28.154-.4.27-.478.386s-.137.272-.171.59c-.037.336-.038.772-.038 1.434v2.044l8.5-3.4c-.002-1.108-.015-1.907-.103-2.503c-.1-.672-.27-.901-.454-1.024c-.185-.123-.463-.191-1.12-.024m3.177 4.042v-.035c0-1.306 0-2.37-.12-3.179c-.123-.836-.4-1.582-1.106-2.053c-.708-.47-1.503-.437-2.322-.228c-.792.201-1.774.612-2.978 1.116l-2.094.877c-.565.236-1.043.436-1.418.644c-.4.22-.743.48-1.001.868s-.366.805-.415 1.259c-.046.426-.046.944-.046 1.556v7.953A3.25 3.25 0 1 0 12.712 19h.038v-6.493l8.5-3.4v5.653a3.25 3.25 0 1 0 1.482 2.393h.018zM19.5 15.75a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5m-10 2a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5" clipRule="evenodd"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M8.512 3.698A2.44 2.44 0 0 0 10 4.25a.75.75 0 0 1 0 1.5c-.72 0-1.551-.24-2.25-.745V11c0 .16-.05.307-.135.429A3.252 3.252 0 0 1 1.25 10.5a3.25 3.25 0 0 1 5-2.74V2h1.5c0 .798.328 1.34.762 1.698M6.25 10.5a1.75 1.75 0 1 0-3.5 0a1.75 1.75 0 0 0 3.5 0m13.323-6.559c-.672.171-1.552.537-2.828 1.071l-2 .838c-.61.255-1.012.424-1.308.588c-.28.154-.4.27-.478.386s-.137.272-.171.59c-.037.336-.038.772-.038 1.434v2.044l8.5-3.4c-.002-1.108-.015-1.907-.103-2.503c-.1-.672-.27-.901-.454-1.024c-.185-.123-.463-.191-1.12-.024m3.177 4.042v-.035c0-1.306 0-2.37-.12-3.179c-.123-.836-.4-1.582-1.106-2.053c-.708-.47-1.503-.437-2.322-.228c-.792.201-1.774.612-2.978 1.116l-2.094.877c-.565.236-1.043.436-1.418.644c-.4.22-.743.48-1.001.868s-.366.805-.415 1.259c-.046.426-.046.944-.046 1.556v7.953A3.25 3.25 0 1 0 12.712 19h.038v-6.493l8.5-3.4v5.653a3.25 3.25 0 1 0 1.482 2.393h.018zM19.5 15.75a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5m-10 2a1.75 1.75 0 1 0 0 3.5a1.75 1.75 0 0 0 0-3.5" clip-rule="evenodd"/></svg> </template>
CSS
.icon-music-notes {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M8.512%203.698A2.44%202.44%200%200%200%2010%204.25a.75.75%200%200%201%200%201.5c-.72%200-1.551-.24-2.25-.745V11c0%20.16-.05.307-.135.429A3.252%203.252%200%200%201%201.25%2010.5a3.25%203.25%200%200%201%205-2.74V2h1.5c0%20.798.328%201.34.762%201.698M6.25%2010.5a1.75%201.75%200%201%200-3.5%200a1.75%201.75%200%200%200%203.5%200m13.323-6.559c-.672.171-1.552.537-2.828%201.071l-2%20.838c-.61.255-1.012.424-1.308.588c-.28.154-.4.27-.478.386s-.137.272-.171.59c-.037.336-.038.772-.038%201.434v2.044l8.5-3.4c-.002-1.108-.015-1.907-.103-2.503c-.1-.672-.27-.901-.454-1.024c-.185-.123-.463-.191-1.12-.024m3.177%204.042v-.035c0-1.306%200-2.37-.12-3.179c-.123-.836-.4-1.582-1.106-2.053c-.708-.47-1.503-.437-2.322-.228c-.792.201-1.774.612-2.978%201.116l-2.094.877c-.565.236-1.043.436-1.418.644c-.4.22-.743.48-1.001.868s-.366.805-.415%201.259c-.046.426-.046.944-.046%201.556v7.953A3.25%203.25%200%201%200%2012.712%2019h.038v-6.493l8.5-3.4v5.653a3.25%203.25%200%201%200%201.482%202.393h.018zM19.5%2015.75a1.75%201.75%200%201%200%200%203.5a1.75%201.75%200%200%200%200-3.5m-10%202a1.75%201.75%200%201%200%200%203.5a1.75%201.75%200%200%200%200-3.5%22%20clip-rule%3D%22evenodd%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M8.512%203.698A2.44%202.44%200%200%200%2010%204.25a.75.75%200%200%201%200%201.5c-.72%200-1.551-.24-2.25-.745V11c0%20.16-.05.307-.135.429A3.252%203.252%200%200%201%201.25%2010.5a3.25%203.25%200%200%201%205-2.74V2h1.5c0%20.798.328%201.34.762%201.698M6.25%2010.5a1.75%201.75%200%201%200-3.5%200a1.75%201.75%200%200%200%203.5%200m13.323-6.559c-.672.171-1.552.537-2.828%201.071l-2%20.838c-.61.255-1.012.424-1.308.588c-.28.154-.4.27-.478.386s-.137.272-.171.59c-.037.336-.038.772-.038%201.434v2.044l8.5-3.4c-.002-1.108-.015-1.907-.103-2.503c-.1-.672-.27-.901-.454-1.024c-.185-.123-.463-.191-1.12-.024m3.177%204.042v-.035c0-1.306%200-2.37-.12-3.179c-.123-.836-.4-1.582-1.106-2.053c-.708-.47-1.503-.437-2.322-.228c-.792.201-1.774.612-2.978%201.116l-2.094.877c-.565.236-1.043.436-1.418.644c-.4.22-.743.48-1.001.868s-.366.805-.415%201.259c-.046.426-.046.944-.046%201.556v7.953A3.25%203.25%200%201%200%2012.712%2019h.038v-6.493l8.5-3.4v5.653a3.25%203.25%200%201%200%201.482%202.393h.018zM19.5%2015.75a1.75%201.75%200%201%200%200%203.5a1.75%201.75%200%200%200%200-3.5m-10%202a1.75%201.75%200%201%200%200%203.5a1.75%201.75%200%200%200%200-3.5%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/music-notes.svg?color=%231a73e8&size=48
