matter icon
matter from Material Symbols Light by Google · Regular · Household · Apache-2.0 Free for personal and commercial use.
- Name
- matter
- Set
- Material Symbols Light
- Style
- Regular
- Category
- Household
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- matter-outline, matter-outline-rounded, matter-outline-sharp, matter-rounded, matter-sharp
The same icon in other sets
More household icons from Material Symbols Light
Use the matter icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M9.435 9.541Q8.23 9.083 7.246 8.277l.915-.556q.6.442 1.435.767q.835.326 1.904.508V3.39l.5-.312l.5.312v5.607q1.03-.183 1.866-.508q.834-.324 1.473-.767l.915.556q-.985.806-2.189 1.264Q13.363 10 12 10t-2.565-.459m.974 9.584l-.946-.513q.031-.148.034-.306T9.5 18q0-.633-.167-1.378t-.483-1.553l-4.844 2.904l-.506-.28v-.58l4.82-2.897q-.655-.749-1.372-1.304q-.717-.556-1.448-.889v-1.08q2.177.77 3.589 2.687T10.5 18q0 .289-.021.568q-.021.28-.07.557m3.181 0q-.048-.277-.069-.557T13.5 18q0-2.454 1.412-4.37q1.411-1.917 3.588-2.688v1.062q-.711.294-1.429.869q-.717.575-1.39 1.343l4.819 2.897v.58l-.506.28l-4.844-2.904q-.315.808-.483 1.553T14.5 18q0 .148.003.306q.003.157.034.305z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLightMatter(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" d="M9.435 9.541Q8.23 9.083 7.246 8.277l.915-.556q.6.442 1.435.767q.835.326 1.904.508V3.39l.5-.312l.5.312v5.607q1.03-.183 1.866-.508q.834-.324 1.473-.767l.915.556q-.985.806-2.189 1.264Q13.363 10 12 10t-2.565-.459m.974 9.584l-.946-.513q.031-.148.034-.306T9.5 18q0-.633-.167-1.378t-.483-1.553l-4.844 2.904l-.506-.28v-.58l4.82-2.897q-.655-.749-1.372-1.304q-.717-.556-1.448-.889v-1.08q2.177.77 3.589 2.687T10.5 18q0 .289-.021.568q-.021.28-.07.557m3.181 0q-.048-.277-.069-.557T13.5 18q0-2.454 1.412-4.37q1.411-1.917 3.588-2.688v1.062q-.711.294-1.429.869q-.717.575-1.39 1.343l4.819 2.897v.58l-.506.28l-4.844-2.904q-.315.808-.483 1.553T14.5 18q0 .148.003.306q.003.157.034.305z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M9.435 9.541Q8.23 9.083 7.246 8.277l.915-.556q.6.442 1.435.767q.835.326 1.904.508V3.39l.5-.312l.5.312v5.607q1.03-.183 1.866-.508q.834-.324 1.473-.767l.915.556q-.985.806-2.189 1.264Q13.363 10 12 10t-2.565-.459m.974 9.584l-.946-.513q.031-.148.034-.306T9.5 18q0-.633-.167-1.378t-.483-1.553l-4.844 2.904l-.506-.28v-.58l4.82-2.897q-.655-.749-1.372-1.304q-.717-.556-1.448-.889v-1.08q2.177.77 3.589 2.687T10.5 18q0 .289-.021.568q-.021.28-.07.557m3.181 0q-.048-.277-.069-.557T13.5 18q0-2.454 1.412-4.37q1.411-1.917 3.588-2.688v1.062q-.711.294-1.429.869q-.717.575-1.39 1.343l4.819 2.897v.58l-.506.28l-4.844-2.904q-.315.808-.483 1.553T14.5 18q0 .148.003.306q.003.157.034.305z"/></svg> </template>
CSS
.icon-matter {
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%20d%3D%22M9.435%209.541Q8.23%209.083%207.246%208.277l.915-.556q.6.442%201.435.767q.835.326%201.904.508V3.39l.5-.312l.5.312v5.607q1.03-.183%201.866-.508q.834-.324%201.473-.767l.915.556q-.985.806-2.189%201.264Q13.363%2010%2012%2010t-2.565-.459m.974%209.584l-.946-.513q.031-.148.034-.306T9.5%2018q0-.633-.167-1.378t-.483-1.553l-4.844%202.904l-.506-.28v-.58l4.82-2.897q-.655-.749-1.372-1.304q-.717-.556-1.448-.889v-1.08q2.177.77%203.589%202.687T10.5%2018q0%20.289-.021.568q-.021.28-.07.557m3.181%200q-.048-.277-.069-.557T13.5%2018q0-2.454%201.412-4.37q1.411-1.917%203.588-2.688v1.062q-.711.294-1.429.869q-.717.575-1.39%201.343l4.819%202.897v.58l-.506.28l-4.844-2.904q-.315.808-.483%201.553T14.5%2018q0%20.148.003.306q.003.157.034.305z%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%20d%3D%22M9.435%209.541Q8.23%209.083%207.246%208.277l.915-.556q.6.442%201.435.767q.835.326%201.904.508V3.39l.5-.312l.5.312v5.607q1.03-.183%201.866-.508q.834-.324%201.473-.767l.915.556q-.985.806-2.189%201.264Q13.363%2010%2012%2010t-2.565-.459m.974%209.584l-.946-.513q.031-.148.034-.306T9.5%2018q0-.633-.167-1.378t-.483-1.553l-4.844%202.904l-.506-.28v-.58l4.82-2.897q-.655-.749-1.372-1.304q-.717-.556-1.448-.889v-1.08q2.177.77%203.589%202.687T10.5%2018q0%20.289-.021.568q-.021.28-.07.557m3.181%200q-.048-.277-.069-.557T13.5%2018q0-2.454%201.412-4.37q1.411-1.917%203.588-2.688v1.062q-.711.294-1.429.869q-.717.575-1.39%201.343l4.819%202.897v.58l-.506.28l-4.844-2.904q-.315.808-.483%201.553T14.5%2018q0%20.148.003.306q.003.157.034.305z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/matter.svg?color=%231a73e8&size=48
