light-group from Material Symbols Light by Google · Regular · Home · Apache-2.0 Free for personal and commercial use.

Name
light-group
Set
Material Symbols Light
Style
Regular
Category
Home
Viewbox
24×24
License
Apache 2.0

5 other variants in Material Symbols Light

The same icon in other sets

More home icons from Material Symbols Light

Use the light group icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.5 21v-1h7v1zm13.5-.961q-.633 0-1.086-.463q-.452-.462-.452-1.095h-2.616q-.329 0-.568-.201q-.24-.201-.24-.51q.028-1.712 1.353-2.882t3.109-1.346V3.981h1v9.561q1.81.177 3.132 1.347t1.349 2.88q0 .31-.24.51q-.239.202-.568.202h-2.615q0 .632-.45 1.095T17 20.038M6.5 18.5V11H3.058q-.404 0-.643-.32q-.24-.32-.134-.7l1.433-5.384q.061-.267.276-.431Q4.204 4 4.496 4H9.53q.292 0 .507.165q.214.164.276.431l1.432 5.385q.106.379-.133.699q-.24.32-.644.32H7.5v7.5z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightLightGroup(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="M3.5 21v-1h7v1zm13.5-.961q-.633 0-1.086-.463q-.452-.462-.452-1.095h-2.616q-.329 0-.568-.201q-.24-.201-.24-.51q.028-1.712 1.353-2.882t3.109-1.346V3.981h1v9.561q1.81.177 3.132 1.347t1.349 2.88q0 .31-.24.51q-.239.202-.568.202h-2.615q0 .632-.45 1.095T17 20.038M6.5 18.5V11H3.058q-.404 0-.643-.32q-.24-.32-.134-.7l1.433-5.384q.061-.267.276-.431Q4.204 4 4.496 4H9.53q.292 0 .507.165q.214.164.276.431l1.432 5.385q.106.379-.133.699q-.24.32-.644.32H7.5v7.5z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.5 21v-1h7v1zm13.5-.961q-.633 0-1.086-.463q-.452-.462-.452-1.095h-2.616q-.329 0-.568-.201q-.24-.201-.24-.51q.028-1.712 1.353-2.882t3.109-1.346V3.981h1v9.561q1.81.177 3.132 1.347t1.349 2.88q0 .31-.24.51q-.239.202-.568.202h-2.615q0 .632-.45 1.095T17 20.038M6.5 18.5V11H3.058q-.404 0-.643-.32q-.24-.32-.134-.7l1.433-5.384q.061-.267.276-.431Q4.204 4 4.496 4H9.53q.292 0 .507.165q.214.164.276.431l1.432 5.385q.106.379-.133.699q-.24.32-.644.32H7.5v7.5z"/></svg>
</template>

CSS

.icon-light-group {
  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%22M3.5%2021v-1h7v1zm13.5-.961q-.633%200-1.086-.463q-.452-.462-.452-1.095h-2.616q-.329%200-.568-.201q-.24-.201-.24-.51q.028-1.712%201.353-2.882t3.109-1.346V3.981h1v9.561q1.81.177%203.132%201.347t1.349%202.88q0%20.31-.24.51q-.239.202-.568.202h-2.615q0%20.632-.45%201.095T17%2020.038M6.5%2018.5V11H3.058q-.404%200-.643-.32q-.24-.32-.134-.7l1.433-5.384q.061-.267.276-.431Q4.204%204%204.496%204H9.53q.292%200%20.507.165q.214.164.276.431l1.432%205.385q.106.379-.133.699q-.24.32-.644.32H7.5v7.5z%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%22M3.5%2021v-1h7v1zm13.5-.961q-.633%200-1.086-.463q-.452-.462-.452-1.095h-2.616q-.329%200-.568-.201q-.24-.201-.24-.51q.028-1.712%201.353-2.882t3.109-1.346V3.981h1v9.561q1.81.177%203.132%201.347t1.349%202.88q0%20.31-.24.51q-.239.202-.568.202h-2.615q0%20.632-.45%201.095T17%2020.038M6.5%2018.5V11H3.058q-.404%200-.643-.32q-.24-.32-.134-.7l1.433-5.384q.061-.267.276-.431Q4.204%204%204.496%204H9.53q.292%200%20.507.165q.214.164.276.431l1.432%205.385q.106.379-.133.699q-.24.32-.644.32H7.5v7.5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/light-group.svg?color=%231a73e8&size=48