agents icon

agents-24 from Fluent UI System Color Icons by Microsoft Corporation · 24 · MIT Free for personal and commercial use.

Name: agents-24
Set: Fluent UI System Color Icons
Style: 24
Viewbox: 24×24
License: MIT

5 other variants in Fluent UI System Color Icons

agents-16 agents-20 agents-28 agents-32 agents-48

The same icon in other sets

Use the agents icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGJKhN0dHY)" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGqRk8R5MS)" fill-opacity=".5" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGxzzsuevZ)" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGHCIvPbSu)" fill-opacity=".4" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGxzzsuevZ)" d="M15.834 3.002L15.75 3h.084z"/><path fill="url(#SVGHCIvPbSu)" fill-opacity=".4" d="M15.834 3.002L15.75 3h.084z"/><defs><radialGradient id="SVGJKhN0dHY" cx="0" cy="0" r="1" gradientTransform="rotate(-87.747 20.409 5.718)scale(26.2489 22.3637)" gradientUnits="userSpaceOnUse"><stop stop-color="#ffc470"/><stop offset=".251" stop-color="#ff835c"/><stop offset=".584" stop-color="#f24a9d"/><stop offset=".871" stop-color="#b339f0"/><stop offset="1" stop-color="#c354ff"/></radialGradient><radialGradient id="SVGqRk8R5MS" cx="0" cy="0" r="1" gradientTransform="rotate(222.775 10.393 6.843)scale(16.2849 16.4328)" gradientUnits="userSpaceOnUse"><stop offset=".709" stop-color="#ffb357" stop-opacity="0"/><stop offset=".942" stop-color="#ffb357"/></radialGradient><radialGradient id="SVGxzzsuevZ" cx="0" cy="0" r="1" gradientTransform="rotate(200.083 11.874 7.798)scale(25.461 21.8263)" gradientUnits="userSpaceOnUse"><stop offset=".222" stop-color="#4e46e2"/><stop offset=".578" stop-color="#625df6"/><stop offset=".955" stop-color="#e37dff"/></radialGradient><linearGradient id="SVGHCIvPbSu" x1="6.196" x2="12.208" y1="10.457" y2="11.854" gradientUnits="userSpaceOnUse"><stop stop-color="#7563f7" stop-opacity="0"/><stop offset=".986" stop-color="#4916ae"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function FluentColorAgents24(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGJKhN0dHY)" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGqRk8R5MS)" fillOpacity=".5" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGxzzsuevZ)" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGHCIvPbSu)" fillOpacity=".4" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGxzzsuevZ)" d="M15.834 3.002L15.75 3h.084z"/><path fill="url(#SVGHCIvPbSu)" fillOpacity=".4" d="M15.834 3.002L15.75 3h.084z"/><defs><radialGradient id="SVGJKhN0dHY" cx="0" cy="0" r="1" gradientTransform="rotate(-87.747 20.409 5.718)scale(26.2489 22.3637)" gradientUnits="userSpaceOnUse"><stop stopColor="#ffc470"/><stop offset=".251" stopColor="#ff835c"/><stop offset=".584" stopColor="#f24a9d"/><stop offset=".871" stopColor="#b339f0"/><stop offset="1" stopColor="#c354ff"/></radialGradient><radialGradient id="SVGqRk8R5MS" cx="0" cy="0" r="1" gradientTransform="rotate(222.775 10.393 6.843)scale(16.2849 16.4328)" gradientUnits="userSpaceOnUse"><stop offset=".709" stopColor="#ffb357" stopOpacity="0"/><stop offset=".942" stopColor="#ffb357"/></radialGradient><radialGradient id="SVGxzzsuevZ" cx="0" cy="0" r="1" gradientTransform="rotate(200.083 11.874 7.798)scale(25.461 21.8263)" gradientUnits="userSpaceOnUse"><stop offset=".222" stopColor="#4e46e2"/><stop offset=".578" stopColor="#625df6"/><stop offset=".955" stopColor="#e37dff"/></radialGradient><linearGradient id="SVGHCIvPbSu" x1="6.196" x2="12.208" y1="10.457" y2="11.854" gradientUnits="userSpaceOnUse"><stop stopColor="#7563f7" stopOpacity="0"/><stop offset=".986" stopColor="#4916ae"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVGJKhN0dHY)" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGqRk8R5MS)" fill-opacity=".5" d="m13.918 3l-3.586 2.461l-2.971 15.452q.309.085.639.087h8v-.003a2.25 2.25 0 0 0 1.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55 0-2.246l-3.824-6.64a2.47 2.47 0 0 0-.904-.906l-.025-.014a2.5 2.5 0 0 0-.964-.305L16 3z"/><path fill="url(#SVGxzzsuevZ)" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGHCIvPbSu)" fill-opacity=".4" d="M13.776 4.674L9.953 19.432a2 2 0 0 1-2.068 1.565a2.45 2.45 0 0 1-1.102-.326l-.025-.014a2.45 2.45 0 0 1-.9-.933l-3.614-6.627a2.25 2.25 0 0 1 .026-2.2l3.897-6.77a2.3 2.3 0 0 1 .272-.376h-.012A2.25 2.25 0 0 1 8 3.002V3h7.75a2 2 0 0 0-1.974 1.674"/><path fill="url(#SVGxzzsuevZ)" d="M15.834 3.002L15.75 3h.084z"/><path fill="url(#SVGHCIvPbSu)" fill-opacity=".4" d="M15.834 3.002L15.75 3h.084z"/><defs><radialGradient id="SVGJKhN0dHY" cx="0" cy="0" r="1" gradientTransform="rotate(-87.747 20.409 5.718)scale(26.2489 22.3637)" gradientUnits="userSpaceOnUse"><stop stop-color="#ffc470"/><stop offset=".251" stop-color="#ff835c"/><stop offset=".584" stop-color="#f24a9d"/><stop offset=".871" stop-color="#b339f0"/><stop offset="1" stop-color="#c354ff"/></radialGradient><radialGradient id="SVGqRk8R5MS" cx="0" cy="0" r="1" gradientTransform="rotate(222.775 10.393 6.843)scale(16.2849 16.4328)" gradientUnits="userSpaceOnUse"><stop offset=".709" stop-color="#ffb357" stop-opacity="0"/><stop offset=".942" stop-color="#ffb357"/></radialGradient><radialGradient id="SVGxzzsuevZ" cx="0" cy="0" r="1" gradientTransform="rotate(200.083 11.874 7.798)scale(25.461 21.8263)" gradientUnits="userSpaceOnUse"><stop offset=".222" stop-color="#4e46e2"/><stop offset=".578" stop-color="#625df6"/><stop offset=".955" stop-color="#e37dff"/></radialGradient><linearGradient id="SVGHCIvPbSu" x1="6.196" x2="12.208" y1="10.457" y2="11.854" gradientUnits="userSpaceOnUse"><stop stop-color="#7563f7" stop-opacity="0"/><stop offset=".986" stop-color="#4916ae"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-agents-24 {
  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%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGJKhN0dHY)%22%20d%3D%22m13.918%203l-3.586%202.461l-2.971%2015.452q.309.085.639.087h8v-.003a2.25%202.25%200%200%200%201.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55%200-2.246l-3.824-6.64a2.47%202.47%200%200%200-.904-.906l-.025-.014a2.5%202.5%200%200%200-.964-.305L16%203z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGqRk8R5MS)%22%20fill-opacity%3D%22.5%22%20d%3D%22m13.918%203l-3.586%202.461l-2.971%2015.452q.309.085.639.087h8v-.003a2.25%202.25%200%200%200%201.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55%200-2.246l-3.824-6.64a2.47%202.47%200%200%200-.904-.906l-.025-.014a2.5%202.5%200%200%200-.964-.305L16%203z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGxzzsuevZ)%22%20d%3D%22M13.776%204.674L9.953%2019.432a2%202%200%200%201-2.068%201.565a2.45%202.45%200%200%201-1.102-.326l-.025-.014a2.45%202.45%200%200%201-.9-.933l-3.614-6.627a2.25%202.25%200%200%201%20.026-2.2l3.897-6.77a2.3%202.3%200%200%201%20.272-.376h-.012A2.25%202.25%200%200%201%208%203.002V3h7.75a2%202%200%200%200-1.974%201.674%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHCIvPbSu)%22%20fill-opacity%3D%22.4%22%20d%3D%22M13.776%204.674L9.953%2019.432a2%202%200%200%201-2.068%201.565a2.45%202.45%200%200%201-1.102-.326l-.025-.014a2.45%202.45%200%200%201-.9-.933l-3.614-6.627a2.25%202.25%200%200%201%20.026-2.2l3.897-6.77a2.3%202.3%200%200%201%20.272-.376h-.012A2.25%202.25%200%200%201%208%203.002V3h7.75a2%202%200%200%200-1.974%201.674%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGxzzsuevZ)%22%20d%3D%22M15.834%203.002L15.75%203h.084z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHCIvPbSu)%22%20fill-opacity%3D%22.4%22%20d%3D%22M15.834%203.002L15.75%203h.084z%22%2F%3E%3Cdefs%3E%3CradialGradient%20id%3D%22SVGJKhN0dHY%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(-87.747%2020.409%205.718)scale(26.2489%2022.3637)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffc470%22%2F%3E%3Cstop%20offset%3D%22.251%22%20stop-color%3D%22%23ff835c%22%2F%3E%3Cstop%20offset%3D%22.584%22%20stop-color%3D%22%23f24a9d%22%2F%3E%3Cstop%20offset%3D%22.871%22%20stop-color%3D%22%23b339f0%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c354ff%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%22SVGqRk8R5MS%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(222.775%2010.393%206.843)scale(16.2849%2016.4328)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.709%22%20stop-color%3D%22%23ffb357%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.942%22%20stop-color%3D%22%23ffb357%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%22SVGxzzsuevZ%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(200.083%2011.874%207.798)scale(25.461%2021.8263)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.222%22%20stop-color%3D%22%234e46e2%22%2F%3E%3Cstop%20offset%3D%22.578%22%20stop-color%3D%22%23625df6%22%2F%3E%3Cstop%20offset%3D%22.955%22%20stop-color%3D%22%23e37dff%22%2F%3E%3C%2FradialGradient%3E%3ClinearGradient%20id%3D%22SVGHCIvPbSu%22%20x1%3D%226.196%22%20x2%3D%2212.208%22%20y1%3D%2210.457%22%20y2%3D%2211.854%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%237563f7%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.986%22%20stop-color%3D%22%234916ae%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGJKhN0dHY)%22%20d%3D%22m13.918%203l-3.586%202.461l-2.971%2015.452q.309.085.639.087h8v-.003a2.25%202.25%200%200%200%201.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55%200-2.246l-3.824-6.64a2.47%202.47%200%200%200-.904-.906l-.025-.014a2.5%202.5%200%200%200-.964-.305L16%203z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGqRk8R5MS)%22%20fill-opacity%3D%22.5%22%20d%3D%22m13.918%203l-3.586%202.461l-2.971%2015.452q.309.085.639.087h8v-.003a2.25%202.25%200%200%200%201.844-1.122l.666-1.155l-.028.034l.008-.023l3.23-5.608c.4-.695.4-1.55%200-2.246l-3.824-6.64a2.47%202.47%200%200%200-.904-.906l-.025-.014a2.5%202.5%200%200%200-.964-.305L16%203z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGxzzsuevZ)%22%20d%3D%22M13.776%204.674L9.953%2019.432a2%202%200%200%201-2.068%201.565a2.45%202.45%200%200%201-1.102-.326l-.025-.014a2.45%202.45%200%200%201-.9-.933l-3.614-6.627a2.25%202.25%200%200%201%20.026-2.2l3.897-6.77a2.3%202.3%200%200%201%20.272-.376h-.012A2.25%202.25%200%200%201%208%203.002V3h7.75a2%202%200%200%200-1.974%201.674%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHCIvPbSu)%22%20fill-opacity%3D%22.4%22%20d%3D%22M13.776%204.674L9.953%2019.432a2%202%200%200%201-2.068%201.565a2.45%202.45%200%200%201-1.102-.326l-.025-.014a2.45%202.45%200%200%201-.9-.933l-3.614-6.627a2.25%202.25%200%200%201%20.026-2.2l3.897-6.77a2.3%202.3%200%200%201%20.272-.376h-.012A2.25%202.25%200%200%201%208%203.002V3h7.75a2%202%200%200%200-1.974%201.674%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGxzzsuevZ)%22%20d%3D%22M15.834%203.002L15.75%203h.084z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHCIvPbSu)%22%20fill-opacity%3D%22.4%22%20d%3D%22M15.834%203.002L15.75%203h.084z%22%2F%3E%3Cdefs%3E%3CradialGradient%20id%3D%22SVGJKhN0dHY%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(-87.747%2020.409%205.718)scale(26.2489%2022.3637)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffc470%22%2F%3E%3Cstop%20offset%3D%22.251%22%20stop-color%3D%22%23ff835c%22%2F%3E%3Cstop%20offset%3D%22.584%22%20stop-color%3D%22%23f24a9d%22%2F%3E%3Cstop%20offset%3D%22.871%22%20stop-color%3D%22%23b339f0%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c354ff%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%22SVGqRk8R5MS%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(222.775%2010.393%206.843)scale(16.2849%2016.4328)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.709%22%20stop-color%3D%22%23ffb357%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.942%22%20stop-color%3D%22%23ffb357%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%22SVGxzzsuevZ%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(200.083%2011.874%207.798)scale(25.461%2021.8263)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.222%22%20stop-color%3D%22%234e46e2%22%2F%3E%3Cstop%20offset%3D%22.578%22%20stop-color%3D%22%23625df6%22%2F%3E%3Cstop%20offset%3D%22.955%22%20stop-color%3D%22%23e37dff%22%2F%3E%3C%2FradialGradient%3E%3ClinearGradient%20id%3D%22SVGHCIvPbSu%22%20x1%3D%226.196%22%20x2%3D%2212.208%22%20y1%3D%2210.457%22%20y2%3D%2211.854%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%237563f7%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.986%22%20stop-color%3D%22%234916ae%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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