Agents Person icon
The Agents Person icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Agents Person icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { AgentsPerson24Regular, AgentsPerson24Filled } from "@fluentui/react-icons";
export function Example() {
return <AgentsPerson24Regular aria-label="Agents Person" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_agents_person_24_regular.svg" width="24" height="24" alt="Agents Person"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.2275 17C21.2065 17 22 17.7934 22 18.7725V18.875C22 20.4315 20.7143 22 17.5 22C14.2858 22 13 20.4373 13 18.875V18.7725C13 17.7936 13.7936 17.0002 14.7724 17H20.2275ZM11.249 3C11.6632 3 11.999 3.33579 11.999 3.75C11.999 4.16421 11.6632 4.5 11.249 4.5H8.11618C7.84812 4.50019 7.60054 4.64366 7.46676 4.87598L3.56831 11.6455C3.43816 11.8717 3.43559 12.1498 3.5605 12.3789L7.17477 19.0059C7.34082 19.3102 7.66013 19.4997 8.0068 19.5C8.41973 19.5 8.78585 19.2323 8.9111 18.8389L13.4033 4.71973C13.7292 3.69563 14.6811 3.00018 15.7558 3C16.6384 3.00008 17.4539 3.47159 17.8945 4.23633L21.7178 10.877C22.1179 11.5719 22.1179 12.4281 21.7178 13.123L20.7422 14.8164C20.9074 14.4099 21 13.9659 21 13.5C21 12.6851 20.7209 11.9357 20.2539 11.3408L16.5947 4.98535C16.4219 4.68534 16.1021 4.50008 15.7558 4.5C15.3343 4.50018 14.9608 4.77309 14.833 5.1748L10.3398 19.2939C10.0165 20.3098 9.07292 21 8.0068 21C7.11118 20.9997 6.28725 20.5099 5.85836 19.7236L2.24312 13.0977C1.86815 12.4101 1.87789 11.5763 2.26851 10.8975L6.16598 4.12695C6.56748 3.4297 7.31161 3.00019 8.11618 3H11.249ZM17.5 11C18.8807 11 20 12.1193 20 13.5C20 14.8807 18.8807 16 17.5 16C16.1194 15.9999 15 14.8807 15 13.5C15 12.1193 16.1194 11.0001 17.5 11Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/agents_person_24_regular.svg";Details
| Name | Agents Person |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_agents_person_24_regular.svg |
| Filled file | ic_fluent_agents_person_24_filled.svg |
| React components | AgentsPerson24Regular, AgentsPerson24Filled |
| License | MIT (© Microsoft Corporation) |