icons icon
icons-20-regular from Fluent UI System Icons by Microsoft Corporation · 20 Regular · MIT Free for personal and commercial use.
- Name
- icons-20-regular
- Set
- Fluent UI System Icons
- Style
- 20 Regular
- Viewbox
- 20×20
- License
- MIT
3 other variants in Fluent UI System Icons
The same icon in other sets
Use the icons icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M10 3a3 3 0 0 0-2.17 5.072c.104.109.17.25.17.4A.53.53 0 0 1 7.472 9H3.423A.423.423 0 0 0 3 9.423A4.577 4.577 0 0 0 7.577 14h1.126a1.5 1.5 0 0 0 .182.25q-.329.355-.62.75h-.688A5.577 5.577 0 0 1 2 9.423C2 8.637 2.637 8 3.423 8h3.112a4 4 0 1 1 7.339-3h1.96C16.477 5 17 5.522 17 6.167C17 7.179 16.18 8 15.167 8h-1.702q-.115.199-.25.381c.362.203.678.48.927.809a10 10 0 0 0-1.34.11a2 2 0 0 0-.667-.263c-.21-.04-.385-.21-.385-.424c0-.132.068-.253.173-.333a2.5 2.5 0 0 0 .28-.246h.002c.273-.296.487-.647.624-1.034h2.338c.46 0 .833-.373.833-.833A.167.167 0 0 0 15.833 6H13a3 3 0 0 0-3-3m5.657 8.154c-.714-.15-1.513-.262-2.345-.158c-1.569.196-2.381 1.273-2.848 2.437a.5.5 0 1 1-.928-.373c.533-1.33 1.57-2.796 3.652-3.056c.993-.124 1.92.013 2.674.171c.225.047.452.1.657.148l.344.079c.295.065.498.098.637.098a.5.5 0 0 1 .447.724c-.051.102-.135.237-.218.372l-.017.026c-.095.155-.206.335-.324.542a7.5 7.5 0 0 0-.77 1.86c-.155.557-.366 1.306-.734 1.937c-.238.408-.556.797-.996 1.083c-.445.29-.986.456-1.638.456c-1.066 0-1.828-.561-2.301-1.078a4.4 4.4 0 0 1-.558-.762c-.603.611-1.061 1.299-1.444 2.064a.5.5 0 1 1-.894-.448c1.061-2.122 2.667-3.71 5.789-4.75a.5.5 0 1 1 .316.948c-1.251.418-2.222.92-2.997 1.51l.02.038a3.4 3.4 0 0 0 .505.725c.366.398.88.753 1.564.753c.473 0 .822-.118 1.092-.294c.275-.179.495-.435.679-.75c.296-.507.46-1.086.614-1.633q.068-.241.137-.47a8.5 8.5 0 0 1 .747-1.684q.086-.15.166-.283l-.037-.008l-.382-.087a25 25 0 0 0-.609-.137"/></svg>
React
import type { SVGProps } from "react";
export function FluentIcons20Regular(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M10 3a3 3 0 0 0-2.17 5.072c.104.109.17.25.17.4A.53.53 0 0 1 7.472 9H3.423A.423.423 0 0 0 3 9.423A4.577 4.577 0 0 0 7.577 14h1.126a1.5 1.5 0 0 0 .182.25q-.329.355-.62.75h-.688A5.577 5.577 0 0 1 2 9.423C2 8.637 2.637 8 3.423 8h3.112a4 4 0 1 1 7.339-3h1.96C16.477 5 17 5.522 17 6.167C17 7.179 16.18 8 15.167 8h-1.702q-.115.199-.25.381c.362.203.678.48.927.809a10 10 0 0 0-1.34.11a2 2 0 0 0-.667-.263c-.21-.04-.385-.21-.385-.424c0-.132.068-.253.173-.333a2.5 2.5 0 0 0 .28-.246h.002c.273-.296.487-.647.624-1.034h2.338c.46 0 .833-.373.833-.833A.167.167 0 0 0 15.833 6H13a3 3 0 0 0-3-3m5.657 8.154c-.714-.15-1.513-.262-2.345-.158c-1.569.196-2.381 1.273-2.848 2.437a.5.5 0 1 1-.928-.373c.533-1.33 1.57-2.796 3.652-3.056c.993-.124 1.92.013 2.674.171c.225.047.452.1.657.148l.344.079c.295.065.498.098.637.098a.5.5 0 0 1 .447.724c-.051.102-.135.237-.218.372l-.017.026c-.095.155-.206.335-.324.542a7.5 7.5 0 0 0-.77 1.86c-.155.557-.366 1.306-.734 1.937c-.238.408-.556.797-.996 1.083c-.445.29-.986.456-1.638.456c-1.066 0-1.828-.561-2.301-1.078a4.4 4.4 0 0 1-.558-.762c-.603.611-1.061 1.299-1.444 2.064a.5.5 0 1 1-.894-.448c1.061-2.122 2.667-3.71 5.789-4.75a.5.5 0 1 1 .316.948c-1.251.418-2.222.92-2.997 1.51l.02.038a3.4 3.4 0 0 0 .505.725c.366.398.88.753 1.564.753c.473 0 .822-.118 1.092-.294c.275-.179.495-.435.679-.75c.296-.507.46-1.086.614-1.633q.068-.241.137-.47a8.5 8.5 0 0 1 .747-1.684q.086-.15.166-.283l-.037-.008l-.382-.087a25 25 0 0 0-.609-.137"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M10 3a3 3 0 0 0-2.17 5.072c.104.109.17.25.17.4A.53.53 0 0 1 7.472 9H3.423A.423.423 0 0 0 3 9.423A4.577 4.577 0 0 0 7.577 14h1.126a1.5 1.5 0 0 0 .182.25q-.329.355-.62.75h-.688A5.577 5.577 0 0 1 2 9.423C2 8.637 2.637 8 3.423 8h3.112a4 4 0 1 1 7.339-3h1.96C16.477 5 17 5.522 17 6.167C17 7.179 16.18 8 15.167 8h-1.702q-.115.199-.25.381c.362.203.678.48.927.809a10 10 0 0 0-1.34.11a2 2 0 0 0-.667-.263c-.21-.04-.385-.21-.385-.424c0-.132.068-.253.173-.333a2.5 2.5 0 0 0 .28-.246h.002c.273-.296.487-.647.624-1.034h2.338c.46 0 .833-.373.833-.833A.167.167 0 0 0 15.833 6H13a3 3 0 0 0-3-3m5.657 8.154c-.714-.15-1.513-.262-2.345-.158c-1.569.196-2.381 1.273-2.848 2.437a.5.5 0 1 1-.928-.373c.533-1.33 1.57-2.796 3.652-3.056c.993-.124 1.92.013 2.674.171c.225.047.452.1.657.148l.344.079c.295.065.498.098.637.098a.5.5 0 0 1 .447.724c-.051.102-.135.237-.218.372l-.017.026c-.095.155-.206.335-.324.542a7.5 7.5 0 0 0-.77 1.86c-.155.557-.366 1.306-.734 1.937c-.238.408-.556.797-.996 1.083c-.445.29-.986.456-1.638.456c-1.066 0-1.828-.561-2.301-1.078a4.4 4.4 0 0 1-.558-.762c-.603.611-1.061 1.299-1.444 2.064a.5.5 0 1 1-.894-.448c1.061-2.122 2.667-3.71 5.789-4.75a.5.5 0 1 1 .316.948c-1.251.418-2.222.92-2.997 1.51l.02.038a3.4 3.4 0 0 0 .505.725c.366.398.88.753 1.564.753c.473 0 .822-.118 1.092-.294c.275-.179.495-.435.679-.75c.296-.507.46-1.086.614-1.633q.068-.241.137-.47a8.5 8.5 0 0 1 .747-1.684q.086-.15.166-.283l-.037-.008l-.382-.087a25 25 0 0 0-.609-.137"/></svg> </template>
CSS
.icon-icons-20-regular {
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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M10%203a3%203%200%200%200-2.17%205.072c.104.109.17.25.17.4A.53.53%200%200%201%207.472%209H3.423A.423.423%200%200%200%203%209.423A4.577%204.577%200%200%200%207.577%2014h1.126a1.5%201.5%200%200%200%20.182.25q-.329.355-.62.75h-.688A5.577%205.577%200%200%201%202%209.423C2%208.637%202.637%208%203.423%208h3.112a4%204%200%201%201%207.339-3h1.96C16.477%205%2017%205.522%2017%206.167C17%207.179%2016.18%208%2015.167%208h-1.702q-.115.199-.25.381c.362.203.678.48.927.809a10%2010%200%200%200-1.34.11a2%202%200%200%200-.667-.263c-.21-.04-.385-.21-.385-.424c0-.132.068-.253.173-.333a2.5%202.5%200%200%200%20.28-.246h.002c.273-.296.487-.647.624-1.034h2.338c.46%200%20.833-.373.833-.833A.167.167%200%200%200%2015.833%206H13a3%203%200%200%200-3-3m5.657%208.154c-.714-.15-1.513-.262-2.345-.158c-1.569.196-2.381%201.273-2.848%202.437a.5.5%200%201%201-.928-.373c.533-1.33%201.57-2.796%203.652-3.056c.993-.124%201.92.013%202.674.171c.225.047.452.1.657.148l.344.079c.295.065.498.098.637.098a.5.5%200%200%201%20.447.724c-.051.102-.135.237-.218.372l-.017.026c-.095.155-.206.335-.324.542a7.5%207.5%200%200%200-.77%201.86c-.155.557-.366%201.306-.734%201.937c-.238.408-.556.797-.996%201.083c-.445.29-.986.456-1.638.456c-1.066%200-1.828-.561-2.301-1.078a4.4%204.4%200%200%201-.558-.762c-.603.611-1.061%201.299-1.444%202.064a.5.5%200%201%201-.894-.448c1.061-2.122%202.667-3.71%205.789-4.75a.5.5%200%201%201%20.316.948c-1.251.418-2.222.92-2.997%201.51l.02.038a3.4%203.4%200%200%200%20.505.725c.366.398.88.753%201.564.753c.473%200%20.822-.118%201.092-.294c.275-.179.495-.435.679-.75c.296-.507.46-1.086.614-1.633q.068-.241.137-.47a8.5%208.5%200%200%201%20.747-1.684q.086-.15.166-.283l-.037-.008l-.382-.087a25%2025%200%200%200-.609-.137%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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M10%203a3%203%200%200%200-2.17%205.072c.104.109.17.25.17.4A.53.53%200%200%201%207.472%209H3.423A.423.423%200%200%200%203%209.423A4.577%204.577%200%200%200%207.577%2014h1.126a1.5%201.5%200%200%200%20.182.25q-.329.355-.62.75h-.688A5.577%205.577%200%200%201%202%209.423C2%208.637%202.637%208%203.423%208h3.112a4%204%200%201%201%207.339-3h1.96C16.477%205%2017%205.522%2017%206.167C17%207.179%2016.18%208%2015.167%208h-1.702q-.115.199-.25.381c.362.203.678.48.927.809a10%2010%200%200%200-1.34.11a2%202%200%200%200-.667-.263c-.21-.04-.385-.21-.385-.424c0-.132.068-.253.173-.333a2.5%202.5%200%200%200%20.28-.246h.002c.273-.296.487-.647.624-1.034h2.338c.46%200%20.833-.373.833-.833A.167.167%200%200%200%2015.833%206H13a3%203%200%200%200-3-3m5.657%208.154c-.714-.15-1.513-.262-2.345-.158c-1.569.196-2.381%201.273-2.848%202.437a.5.5%200%201%201-.928-.373c.533-1.33%201.57-2.796%203.652-3.056c.993-.124%201.92.013%202.674.171c.225.047.452.1.657.148l.344.079c.295.065.498.098.637.098a.5.5%200%200%201%20.447.724c-.051.102-.135.237-.218.372l-.017.026c-.095.155-.206.335-.324.542a7.5%207.5%200%200%200-.77%201.86c-.155.557-.366%201.306-.734%201.937c-.238.408-.556.797-.996%201.083c-.445.29-.986.456-1.638.456c-1.066%200-1.828-.561-2.301-1.078a4.4%204.4%200%200%201-.558-.762c-.603.611-1.061%201.299-1.444%202.064a.5.5%200%201%201-.894-.448c1.061-2.122%202.667-3.71%205.789-4.75a.5.5%200%201%201%20.316.948c-1.251.418-2.222.92-2.997%201.51l.02.038a3.4%203.4%200%200%200%20.505.725c.366.398.88.753%201.564.753c.473%200%20.822-.118%201.092-.294c.275-.179.495-.435.679-.75c.296-.507.46-1.086.614-1.633q.068-.241.137-.47a8.5%208.5%200%200%201%20.747-1.684q.086-.15.166-.283l-.037-.008l-.382-.087a25%2025%200%200%200-.609-.137%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/icons-20-regular.svg?color=%231a73e8&size=48
