person starburst icon

person-starburst-28 from Fluent UI System Color Icons by Microsoft Corporation · 28 · MIT Free for personal and commercial use.

Name
person-starburst-28
Set
Fluent UI System Color Icons
Style
28
Viewbox
28×28
License
MIT

5 other variants in Fluent UI System Color Icons

person-starburst-16person-starburst-20person-starburst-24person-starburst-32person-starburst-48

The same icon in other sets

person-starburst-16-filledFluent UI System Icons

Related icons in Fluent UI System Color Icons

person-add-20person-available-16person-edit-32person-feedback-16person-heart-20person-key-20person-tentative-16person-warning-16

Use the person starburst icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><g fill="none"><path fill="url(#SVG07uqpd7k)" fill-rule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clip-rule="evenodd"/><path fill="url(#SVGJPV5Fc3v)" fill-opacity=".7" fill-rule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clip-rule="evenodd"/><path fill="url(#SVGAqQWLc9w)" fill-opacity=".9" d="M17.25 9.25a3.25 3.25 0 1 1-6.5 0a3.25 3.25 0 0 1 6.5 0M14 21.5c3.314 0 6-2.143 6-5.357C20 14.959 19.04 14 17.857 14h-7.714C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357"/><defs><linearGradient id="SVG07uqpd7k" x1="6" x2="18" y1=".664" y2="27.331" gradientUnits="userSpaceOnUse"><stop stop-color="#1ec8b0"/><stop offset="1" stop-color="#2764e7"/></linearGradient><linearGradient id="SVGJPV5Fc3v" x1="17.714" x2="22.471" y1="4.944" y2="28.579" gradientUnits="userSpaceOnUse"><stop offset=".533" stop-color="#ff6ce8" stop-opacity="0"/><stop offset="1" stop-color="#ff6ce8"/></linearGradient><linearGradient id="SVGAqQWLc9w" x1="23.005" x2="-4.525" y1="34.786" y2="-4.302" gradientUnits="userSpaceOnUse"><stop stop-color="#9deaff"/><stop offset="1" stop-color="#fff"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function FluentColorPersonStarburst28(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><g fill="none"><path fill="url(#SVG07uqpd7k)" fillRule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clipRule="evenodd"/><path fill="url(#SVGJPV5Fc3v)" fillOpacity=".7" fillRule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clipRule="evenodd"/><path fill="url(#SVGAqQWLc9w)" fillOpacity=".9" d="M17.25 9.25a3.25 3.25 0 1 1-6.5 0a3.25 3.25 0 0 1 6.5 0M14 21.5c3.314 0 6-2.143 6-5.357C20 14.959 19.04 14 17.857 14h-7.714C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357"/><defs><linearGradient id="SVG07uqpd7k" x1="6" x2="18" y1=".664" y2="27.331" gradientUnits="userSpaceOnUse"><stop stopColor="#1ec8b0"/><stop offset="1" stopColor="#2764e7"/></linearGradient><linearGradient id="SVGJPV5Fc3v" x1="17.714" x2="22.471" y1="4.944" y2="28.579" gradientUnits="userSpaceOnUse"><stop offset=".533" stopColor="#ff6ce8" stopOpacity="0"/><stop offset="1" stopColor="#ff6ce8"/></linearGradient><linearGradient id="SVGAqQWLc9w" x1="23.005" x2="-4.525" y1="34.786" y2="-4.302" gradientUnits="userSpaceOnUse"><stop stopColor="#9deaff"/><stop offset="1" stopColor="#fff"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><g fill="none"><path fill="url(#SVG07uqpd7k)" fill-rule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clip-rule="evenodd"/><path fill="url(#SVGJPV5Fc3v)" fill-opacity=".7" fill-rule="evenodd" d="M7.02 4.582a3.75 3.75 0 0 1 5.258-2.179l.705.358a2.25 2.25 0 0 0 2.034 0l.705-.358a3.75 3.75 0 0 1 5.259 2.179l.245.75a2.25 2.25 0 0 0 1.439 1.439l.75.246a3.75 3.75 0 0 1 2.179 5.258l-.357.705a2.25 2.25 0 0 0 0 2.034l.357.705a3.75 3.75 0 0 1-2.178 5.259l-.751.246a2.25 2.25 0 0 0-1.438 1.438l-.247.75a3.75 3.75 0 0 1-5.258 2.179l-.705-.357a2.25 2.25 0 0 0-2.034 0l-.705.357a3.75 3.75 0 0 1-5.258-2.178l-.246-.751a2.25 2.25 0 0 0-1.438-1.438l-.751-.246a3.75 3.75 0 0 1-2.179-5.259l.358-.705a2.25 2.25 0 0 0 0-2.034l-.358-.705a3.75 3.75 0 0 1 2.179-5.258l.75-.246a2.25 2.25 0 0 0 1.439-1.438z" clip-rule="evenodd"/><path fill="url(#SVGAqQWLc9w)" fill-opacity=".9" d="M17.25 9.25a3.25 3.25 0 1 1-6.5 0a3.25 3.25 0 0 1 6.5 0M14 21.5c3.314 0 6-2.143 6-5.357C20 14.959 19.04 14 17.857 14h-7.714C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357"/><defs><linearGradient id="SVG07uqpd7k" x1="6" x2="18" y1=".664" y2="27.331" gradientUnits="userSpaceOnUse"><stop stop-color="#1ec8b0"/><stop offset="1" stop-color="#2764e7"/></linearGradient><linearGradient id="SVGJPV5Fc3v" x1="17.714" x2="22.471" y1="4.944" y2="28.579" gradientUnits="userSpaceOnUse"><stop offset=".533" stop-color="#ff6ce8" stop-opacity="0"/><stop offset="1" stop-color="#ff6ce8"/></linearGradient><linearGradient id="SVGAqQWLc9w" x1="23.005" x2="-4.525" y1="34.786" y2="-4.302" gradientUnits="userSpaceOnUse"><stop stop-color="#9deaff"/><stop offset="1" stop-color="#fff"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-person-starburst-28 {
  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%2028%2028%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG07uqpd7k)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M7.02%204.582a3.75%203.75%200%200%201%205.258-2.179l.705.358a2.25%202.25%200%200%200%202.034%200l.705-.358a3.75%203.75%200%200%201%205.259%202.179l.245.75a2.25%202.25%200%200%200%201.439%201.439l.75.246a3.75%203.75%200%200%201%202.179%205.258l-.357.705a2.25%202.25%200%200%200%200%202.034l.357.705a3.75%203.75%200%200%201-2.178%205.259l-.751.246a2.25%202.25%200%200%200-1.438%201.438l-.247.75a3.75%203.75%200%200%201-5.258%202.179l-.705-.357a2.25%202.25%200%200%200-2.034%200l-.705.357a3.75%203.75%200%200%201-5.258-2.178l-.246-.751a2.25%202.25%200%200%200-1.438-1.438l-.751-.246a3.75%203.75%200%200%201-2.179-5.259l.358-.705a2.25%202.25%200%200%200%200-2.034l-.358-.705a3.75%203.75%200%200%201%202.179-5.258l.75-.246a2.25%202.25%200%200%200%201.439-1.438z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGJPV5Fc3v)%22%20fill-opacity%3D%22.7%22%20fill-rule%3D%22evenodd%22%20d%3D%22M7.02%204.582a3.75%203.75%200%200%201%205.258-2.179l.705.358a2.25%202.25%200%200%200%202.034%200l.705-.358a3.75%203.75%200%200%201%205.259%202.179l.245.75a2.25%202.25%200%200%200%201.439%201.439l.75.246a3.75%203.75%200%200%201%202.179%205.258l-.357.705a2.25%202.25%200%200%200%200%202.034l.357.705a3.75%203.75%200%200%201-2.178%205.259l-.751.246a2.25%202.25%200%200%200-1.438%201.438l-.247.75a3.75%203.75%200%200%201-5.258%202.179l-.705-.357a2.25%202.25%200%200%200-2.034%200l-.705.357a3.75%203.75%200%200%201-5.258-2.178l-.246-.751a2.25%202.25%200%200%200-1.438-1.438l-.751-.246a3.75%203.75%200%200%201-2.179-5.259l.358-.705a2.25%202.25%200%200%200%200-2.034l-.358-.705a3.75%203.75%200%200%201%202.179-5.258l.75-.246a2.25%202.25%200%200%200%201.439-1.438z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGAqQWLc9w)%22%20fill-opacity%3D%22.9%22%20d%3D%22M17.25%209.25a3.25%203.25%200%201%201-6.5%200a3.25%203.25%200%200%201%206.5%200M14%2021.5c3.314%200%206-2.143%206-5.357C20%2014.959%2019.04%2014%2017.857%2014h-7.714C8.959%2014%208%2014.96%208%2016.143c0%203.214%202.686%205.357%206%205.357%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG07uqpd7k%22%20x1%3D%226%22%20x2%3D%2218%22%20y1%3D%22.664%22%20y2%3D%2227.331%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231ec8b0%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%232764e7%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGJPV5Fc3v%22%20x1%3D%2217.714%22%20x2%3D%2222.471%22%20y1%3D%224.944%22%20y2%3D%2228.579%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.533%22%20stop-color%3D%22%23ff6ce8%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ff6ce8%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGAqQWLc9w%22%20x1%3D%2223.005%22%20x2%3D%22-4.525%22%20y1%3D%2234.786%22%20y2%3D%22-4.302%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%239deaff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23fff%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%2028%2028%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG07uqpd7k)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M7.02%204.582a3.75%203.75%200%200%201%205.258-2.179l.705.358a2.25%202.25%200%200%200%202.034%200l.705-.358a3.75%203.75%200%200%201%205.259%202.179l.245.75a2.25%202.25%200%200%200%201.439%201.439l.75.246a3.75%203.75%200%200%201%202.179%205.258l-.357.705a2.25%202.25%200%200%200%200%202.034l.357.705a3.75%203.75%200%200%201-2.178%205.259l-.751.246a2.25%202.25%200%200%200-1.438%201.438l-.247.75a3.75%203.75%200%200%201-5.258%202.179l-.705-.357a2.25%202.25%200%200%200-2.034%200l-.705.357a3.75%203.75%200%200%201-5.258-2.178l-.246-.751a2.25%202.25%200%200%200-1.438-1.438l-.751-.246a3.75%203.75%200%200%201-2.179-5.259l.358-.705a2.25%202.25%200%200%200%200-2.034l-.358-.705a3.75%203.75%200%200%201%202.179-5.258l.75-.246a2.25%202.25%200%200%200%201.439-1.438z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGJPV5Fc3v)%22%20fill-opacity%3D%22.7%22%20fill-rule%3D%22evenodd%22%20d%3D%22M7.02%204.582a3.75%203.75%200%200%201%205.258-2.179l.705.358a2.25%202.25%200%200%200%202.034%200l.705-.358a3.75%203.75%200%200%201%205.259%202.179l.245.75a2.25%202.25%200%200%200%201.439%201.439l.75.246a3.75%203.75%200%200%201%202.179%205.258l-.357.705a2.25%202.25%200%200%200%200%202.034l.357.705a3.75%203.75%200%200%201-2.178%205.259l-.751.246a2.25%202.25%200%200%200-1.438%201.438l-.247.75a3.75%203.75%200%200%201-5.258%202.179l-.705-.357a2.25%202.25%200%200%200-2.034%200l-.705.357a3.75%203.75%200%200%201-5.258-2.178l-.246-.751a2.25%202.25%200%200%200-1.438-1.438l-.751-.246a3.75%203.75%200%200%201-2.179-5.259l.358-.705a2.25%202.25%200%200%200%200-2.034l-.358-.705a3.75%203.75%200%200%201%202.179-5.258l.75-.246a2.25%202.25%200%200%200%201.439-1.438z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGAqQWLc9w)%22%20fill-opacity%3D%22.9%22%20d%3D%22M17.25%209.25a3.25%203.25%200%201%201-6.5%200a3.25%203.25%200%200%201%206.5%200M14%2021.5c3.314%200%206-2.143%206-5.357C20%2014.959%2019.04%2014%2017.857%2014h-7.714C8.959%2014%208%2014.96%208%2016.143c0%203.214%202.686%205.357%206%205.357%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG07uqpd7k%22%20x1%3D%226%22%20x2%3D%2218%22%20y1%3D%22.664%22%20y2%3D%2227.331%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231ec8b0%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%232764e7%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGJPV5Fc3v%22%20x1%3D%2217.714%22%20x2%3D%2222.471%22%20y1%3D%224.944%22%20y2%3D%2228.579%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.533%22%20stop-color%3D%22%23ff6ce8%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ff6ce8%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGAqQWLc9w%22%20x1%3D%2223.005%22%20x2%3D%22-4.525%22%20y1%3D%2234.786%22%20y2%3D%22-4.302%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%239deaff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23fff%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/person-starburst-28.svg?color=%231a73e8&size=48