widget4 icon

widget4-filled from Reicon by REICON · Filled · Settings · MIT Free for personal and commercial use.

Name
widget4-filled
Set
Reicon
Style
Filled
Category
Settings
Viewbox
24×24
License
MIT

2 other variants in Reicon

More settings icons from Reicon

Use the widget4 icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M2 6.21c0-1.984 0-2.977.659-3.593S4.379 2 6.5 2s3.182 0 3.841.617C11 3.233 11 4.226 11 6.21v11.58c0 1.984 0 2.977-.659 3.593S8.621 22 6.5 22s-3.182 0-3.841-.617C2 20.767 2 19.774 2 17.79zm11 9.19c0-2.074 0-3.111.659-3.756S15.379 11 17.5 11s3.182 0 3.841.644C22 12.29 22 13.326 22 15.4v2.2c0 2.074 0 3.111-.659 3.756S19.621 22 17.5 22s-3.182 0-3.841-.644C13 20.71 13 19.674 13 17.6zm0-9.9c0-1.087 0-1.63.171-2.06a2.3 2.3 0 0 1 1.218-1.262C14.802 2 15.327 2 16.375 2h2.25c1.048 0 1.573 0 1.986.178c.551.236.99.69 1.218 1.262c.171.43.171.973.171 2.06s0 1.63-.171 2.06a2.3 2.3 0 0 1-1.218 1.262C20.198 9 19.673 9 18.625 9h-2.25c-1.048 0-1.573 0-1.986-.178a2.3 2.3 0 0 1-1.218-1.262C13 7.13 13 6.587 13 5.5"/></svg>

React

import type { SVGProps } from "react";

export function ReiconWidget4Filled(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="M2 6.21c0-1.984 0-2.977.659-3.593S4.379 2 6.5 2s3.182 0 3.841.617C11 3.233 11 4.226 11 6.21v11.58c0 1.984 0 2.977-.659 3.593S8.621 22 6.5 22s-3.182 0-3.841-.617C2 20.767 2 19.774 2 17.79zm11 9.19c0-2.074 0-3.111.659-3.756S15.379 11 17.5 11s3.182 0 3.841.644C22 12.29 22 13.326 22 15.4v2.2c0 2.074 0 3.111-.659 3.756S19.621 22 17.5 22s-3.182 0-3.841-.644C13 20.71 13 19.674 13 17.6zm0-9.9c0-1.087 0-1.63.171-2.06a2.3 2.3 0 0 1 1.218-1.262C14.802 2 15.327 2 16.375 2h2.25c1.048 0 1.573 0 1.986.178c.551.236.99.69 1.218 1.262c.171.43.171.973.171 2.06s0 1.63-.171 2.06a2.3 2.3 0 0 1-1.218 1.262C20.198 9 19.673 9 18.625 9h-2.25c-1.048 0-1.573 0-1.986-.178a2.3 2.3 0 0 1-1.218-1.262C13 7.13 13 6.587 13 5.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M2 6.21c0-1.984 0-2.977.659-3.593S4.379 2 6.5 2s3.182 0 3.841.617C11 3.233 11 4.226 11 6.21v11.58c0 1.984 0 2.977-.659 3.593S8.621 22 6.5 22s-3.182 0-3.841-.617C2 20.767 2 19.774 2 17.79zm11 9.19c0-2.074 0-3.111.659-3.756S15.379 11 17.5 11s3.182 0 3.841.644C22 12.29 22 13.326 22 15.4v2.2c0 2.074 0 3.111-.659 3.756S19.621 22 17.5 22s-3.182 0-3.841-.644C13 20.71 13 19.674 13 17.6zm0-9.9c0-1.087 0-1.63.171-2.06a2.3 2.3 0 0 1 1.218-1.262C14.802 2 15.327 2 16.375 2h2.25c1.048 0 1.573 0 1.986.178c.551.236.99.69 1.218 1.262c.171.43.171.973.171 2.06s0 1.63-.171 2.06a2.3 2.3 0 0 1-1.218 1.262C20.198 9 19.673 9 18.625 9h-2.25c-1.048 0-1.573 0-1.986-.178a2.3 2.3 0 0 1-1.218-1.262C13 7.13 13 6.587 13 5.5"/></svg>
</template>

CSS

.icon-widget4-filled {
  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%22M2%206.21c0-1.984%200-2.977.659-3.593S4.379%202%206.5%202s3.182%200%203.841.617C11%203.233%2011%204.226%2011%206.21v11.58c0%201.984%200%202.977-.659%203.593S8.621%2022%206.5%2022s-3.182%200-3.841-.617C2%2020.767%202%2019.774%202%2017.79zm11%209.19c0-2.074%200-3.111.659-3.756S15.379%2011%2017.5%2011s3.182%200%203.841.644C22%2012.29%2022%2013.326%2022%2015.4v2.2c0%202.074%200%203.111-.659%203.756S19.621%2022%2017.5%2022s-3.182%200-3.841-.644C13%2020.71%2013%2019.674%2013%2017.6zm0-9.9c0-1.087%200-1.63.171-2.06a2.3%202.3%200%200%201%201.218-1.262C14.802%202%2015.327%202%2016.375%202h2.25c1.048%200%201.573%200%201.986.178c.551.236.99.69%201.218%201.262c.171.43.171.973.171%202.06s0%201.63-.171%202.06a2.3%202.3%200%200%201-1.218%201.262C20.198%209%2019.673%209%2018.625%209h-2.25c-1.048%200-1.573%200-1.986-.178a2.3%202.3%200%200%201-1.218-1.262C13%207.13%2013%206.587%2013%205.5%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%22M2%206.21c0-1.984%200-2.977.659-3.593S4.379%202%206.5%202s3.182%200%203.841.617C11%203.233%2011%204.226%2011%206.21v11.58c0%201.984%200%202.977-.659%203.593S8.621%2022%206.5%2022s-3.182%200-3.841-.617C2%2020.767%202%2019.774%202%2017.79zm11%209.19c0-2.074%200-3.111.659-3.756S15.379%2011%2017.5%2011s3.182%200%203.841.644C22%2012.29%2022%2013.326%2022%2015.4v2.2c0%202.074%200%203.111-.659%203.756S19.621%2022%2017.5%2022s-3.182%200-3.841-.644C13%2020.71%2013%2019.674%2013%2017.6zm0-9.9c0-1.087%200-1.63.171-2.06a2.3%202.3%200%200%201%201.218-1.262C14.802%202%2015.327%202%2016.375%202h2.25c1.048%200%201.573%200%201.986.178c.551.236.99.69%201.218%201.262c.171.43.171.973.171%202.06s0%201.63-.171%202.06a2.3%202.3%200%200%201-1.218%201.262C20.198%209%2019.673%209%2018.625%209h-2.25c-1.048%200-1.573%200-1.986-.178a2.3%202.3%200%200%201-1.218-1.262C13%207.13%2013%206.587%2013%205.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/widget4-filled.svg?color=%231a73e8&size=48