headset icon
headset-48 from Fluent UI System Color Icons by Microsoft Corporation · 48 · MIT Free for personal and commercial use.
- Name
- headset-48
- Set
- Fluent UI System Color Icons
- Style
- 48
- Viewbox
- 48×48
- License
- MIT
5 other variants in Fluent UI System Color Icons
The same icon in other sets
headsetBootstrap IconsheadsetCarbonheadsetElement PlusheadsetFont Awesome 6 SolidheadsetFont Awesome Solidheadset-16-filledFluent UI System Iconsheadsetcss.ggheadsetHuge IconsheadsetIconParkheadsetIconPark OutlineheadsetIconPark SolidheadsetIconPark TwoToneheadsetIconoirheadsetIonIconsheadsetJam IconsheadsetLine AwesomeheadsetLucideheadsetMajesticonsheadsetMaterial Design IconsheadsetPhosphorheadsetPixelarticonsheadsetTabler Iconsheadset-outlineTeenyicons
Use the headset icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVGiutpwccN)" d="M11.25 31L10 32a8.25 8.25 0 0 0 8.25 8.25H20v-2.5h-1.75A5.75 5.75 0 0 1 12.5 32z"/><path fill="url(#SVGIC7IqcNR)" d="M29 39a5 5 0 1 1-10 0a5 5 0 0 1 10 0"/><path fill="url(#SVGRUYlseqW)" d="M12.5 18c0-6.351 5.149-11.5 11.5-11.5S35.5 11.649 35.5 18v2l1 1.5L38 20v-2c0-7.732-6.268-14-14-14s-14 6.268-14 14v2l1.5 1.5l1-1.5z"/><path fill="url(#SVGVIzj3dos)" d="M12.5 20h5.25A2.25 2.25 0 0 1 20 22.25v7.5A2.25 2.25 0 0 1 17.75 32H12.5L11 26z"/><path fill="url(#SVGVIzj3dos)" d="m35.5 31.624l1.5-5.812L35.5 20h-5.25A2.25 2.25 0 0 0 28 22.25v7.5A2.25 2.25 0 0 0 30.25 32h3.5c.624 0 1.216-.134 1.75-.376"/><path fill="url(#SVG6z3Kpbcn)" d="M12.5 20H10v12h2.5z"/><path fill="url(#SVG6z3Kpbcn)" d="M35.5 31.624A4.25 4.25 0 0 0 38 27.75V20h-2.5z"/><defs><linearGradient id="SVGiutpwccN" x1="15.833" x2="12.993" y1="38.708" y2="30.977" gradientUnits="userSpaceOnUse"><stop stop-color="#9ca5ad"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGIC7IqcNR" x1="27.75" x2="19.279" y1="42.75" y2="37.802" gradientUnits="userSpaceOnUse"><stop stop-color="#383b3d"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGRUYlseqW" x1="0" x2="3.354" y1="4" y2="18.391" gradientUnits="userSpaceOnUse"><stop stop-color="#b9c0c7"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGVIzj3dos" x1="24" x2="24" y1="20" y2="32" gradientUnits="userSpaceOnUse"><stop stop-color="#0fafff"/><stop offset="1" stop-color="#0067bf"/></linearGradient><linearGradient id="SVG6z3Kpbcn" x1="24" x2="23.718" y1="20" y2="31.993" gradientUnits="userSpaceOnUse"><stop stop-color="#0078d4"/><stop offset="1" stop-color="#2052cb"/></linearGradient></defs></g></svg>
React
import type { SVGProps } from "react";
export function FluentColorHeadset48(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVGiutpwccN)" d="M11.25 31L10 32a8.25 8.25 0 0 0 8.25 8.25H20v-2.5h-1.75A5.75 5.75 0 0 1 12.5 32z"/><path fill="url(#SVGIC7IqcNR)" d="M29 39a5 5 0 1 1-10 0a5 5 0 0 1 10 0"/><path fill="url(#SVGRUYlseqW)" d="M12.5 18c0-6.351 5.149-11.5 11.5-11.5S35.5 11.649 35.5 18v2l1 1.5L38 20v-2c0-7.732-6.268-14-14-14s-14 6.268-14 14v2l1.5 1.5l1-1.5z"/><path fill="url(#SVGVIzj3dos)" d="M12.5 20h5.25A2.25 2.25 0 0 1 20 22.25v7.5A2.25 2.25 0 0 1 17.75 32H12.5L11 26z"/><path fill="url(#SVGVIzj3dos)" d="m35.5 31.624l1.5-5.812L35.5 20h-5.25A2.25 2.25 0 0 0 28 22.25v7.5A2.25 2.25 0 0 0 30.25 32h3.5c.624 0 1.216-.134 1.75-.376"/><path fill="url(#SVG6z3Kpbcn)" d="M12.5 20H10v12h2.5z"/><path fill="url(#SVG6z3Kpbcn)" d="M35.5 31.624A4.25 4.25 0 0 0 38 27.75V20h-2.5z"/><defs><linearGradient id="SVGiutpwccN" x1="15.833" x2="12.993" y1="38.708" y2="30.977" gradientUnits="userSpaceOnUse"><stop stopColor="#9ca5ad"/><stop offset="1" stopColor="#70777d"/></linearGradient><linearGradient id="SVGIC7IqcNR" x1="27.75" x2="19.279" y1="42.75" y2="37.802" gradientUnits="userSpaceOnUse"><stop stopColor="#383b3d"/><stop offset="1" stopColor="#70777d"/></linearGradient><linearGradient id="SVGRUYlseqW" x1="0" x2="3.354" y1="4" y2="18.391" gradientUnits="userSpaceOnUse"><stop stopColor="#b9c0c7"/><stop offset="1" stopColor="#70777d"/></linearGradient><linearGradient id="SVGVIzj3dos" x1="24" x2="24" y1="20" y2="32" gradientUnits="userSpaceOnUse"><stop stopColor="#0fafff"/><stop offset="1" stopColor="#0067bf"/></linearGradient><linearGradient id="SVG6z3Kpbcn" x1="24" x2="23.718" y1="20" y2="31.993" gradientUnits="userSpaceOnUse"><stop stopColor="#0078d4"/><stop offset="1" stopColor="#2052cb"/></linearGradient></defs></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVGiutpwccN)" d="M11.25 31L10 32a8.25 8.25 0 0 0 8.25 8.25H20v-2.5h-1.75A5.75 5.75 0 0 1 12.5 32z"/><path fill="url(#SVGIC7IqcNR)" d="M29 39a5 5 0 1 1-10 0a5 5 0 0 1 10 0"/><path fill="url(#SVGRUYlseqW)" d="M12.5 18c0-6.351 5.149-11.5 11.5-11.5S35.5 11.649 35.5 18v2l1 1.5L38 20v-2c0-7.732-6.268-14-14-14s-14 6.268-14 14v2l1.5 1.5l1-1.5z"/><path fill="url(#SVGVIzj3dos)" d="M12.5 20h5.25A2.25 2.25 0 0 1 20 22.25v7.5A2.25 2.25 0 0 1 17.75 32H12.5L11 26z"/><path fill="url(#SVGVIzj3dos)" d="m35.5 31.624l1.5-5.812L35.5 20h-5.25A2.25 2.25 0 0 0 28 22.25v7.5A2.25 2.25 0 0 0 30.25 32h3.5c.624 0 1.216-.134 1.75-.376"/><path fill="url(#SVG6z3Kpbcn)" d="M12.5 20H10v12h2.5z"/><path fill="url(#SVG6z3Kpbcn)" d="M35.5 31.624A4.25 4.25 0 0 0 38 27.75V20h-2.5z"/><defs><linearGradient id="SVGiutpwccN" x1="15.833" x2="12.993" y1="38.708" y2="30.977" gradientUnits="userSpaceOnUse"><stop stop-color="#9ca5ad"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGIC7IqcNR" x1="27.75" x2="19.279" y1="42.75" y2="37.802" gradientUnits="userSpaceOnUse"><stop stop-color="#383b3d"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGRUYlseqW" x1="0" x2="3.354" y1="4" y2="18.391" gradientUnits="userSpaceOnUse"><stop stop-color="#b9c0c7"/><stop offset="1" stop-color="#70777d"/></linearGradient><linearGradient id="SVGVIzj3dos" x1="24" x2="24" y1="20" y2="32" gradientUnits="userSpaceOnUse"><stop stop-color="#0fafff"/><stop offset="1" stop-color="#0067bf"/></linearGradient><linearGradient id="SVG6z3Kpbcn" x1="24" x2="23.718" y1="20" y2="31.993" gradientUnits="userSpaceOnUse"><stop stop-color="#0078d4"/><stop offset="1" stop-color="#2052cb"/></linearGradient></defs></g></svg> </template>
CSS
.icon-headset-48 {
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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGiutpwccN)%22%20d%3D%22M11.25%2031L10%2032a8.25%208.25%200%200%200%208.25%208.25H20v-2.5h-1.75A5.75%205.75%200%200%201%2012.5%2032z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGIC7IqcNR)%22%20d%3D%22M29%2039a5%205%200%201%201-10%200a5%205%200%200%201%2010%200%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGRUYlseqW)%22%20d%3D%22M12.5%2018c0-6.351%205.149-11.5%2011.5-11.5S35.5%2011.649%2035.5%2018v2l1%201.5L38%2020v-2c0-7.732-6.268-14-14-14s-14%206.268-14%2014v2l1.5%201.5l1-1.5z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGVIzj3dos)%22%20d%3D%22M12.5%2020h5.25A2.25%202.25%200%200%201%2020%2022.25v7.5A2.25%202.25%200%200%201%2017.75%2032H12.5L11%2026z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGVIzj3dos)%22%20d%3D%22m35.5%2031.624l1.5-5.812L35.5%2020h-5.25A2.25%202.25%200%200%200%2028%2022.25v7.5A2.25%202.25%200%200%200%2030.25%2032h3.5c.624%200%201.216-.134%201.75-.376%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG6z3Kpbcn)%22%20d%3D%22M12.5%2020H10v12h2.5z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG6z3Kpbcn)%22%20d%3D%22M35.5%2031.624A4.25%204.25%200%200%200%2038%2027.75V20h-2.5z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGiutpwccN%22%20x1%3D%2215.833%22%20x2%3D%2212.993%22%20y1%3D%2238.708%22%20y2%3D%2230.977%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%239ca5ad%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGIC7IqcNR%22%20x1%3D%2227.75%22%20x2%3D%2219.279%22%20y1%3D%2242.75%22%20y2%3D%2237.802%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23383b3d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGRUYlseqW%22%20x1%3D%220%22%20x2%3D%223.354%22%20y1%3D%224%22%20y2%3D%2218.391%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23b9c0c7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGVIzj3dos%22%20x1%3D%2224%22%20x2%3D%2224%22%20y1%3D%2220%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230fafff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230067bf%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG6z3Kpbcn%22%20x1%3D%2224%22%20x2%3D%2223.718%22%20y1%3D%2220%22%20y2%3D%2231.993%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230078d4%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%232052cb%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGiutpwccN)%22%20d%3D%22M11.25%2031L10%2032a8.25%208.25%200%200%200%208.25%208.25H20v-2.5h-1.75A5.75%205.75%200%200%201%2012.5%2032z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGIC7IqcNR)%22%20d%3D%22M29%2039a5%205%200%201%201-10%200a5%205%200%200%201%2010%200%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGRUYlseqW)%22%20d%3D%22M12.5%2018c0-6.351%205.149-11.5%2011.5-11.5S35.5%2011.649%2035.5%2018v2l1%201.5L38%2020v-2c0-7.732-6.268-14-14-14s-14%206.268-14%2014v2l1.5%201.5l1-1.5z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGVIzj3dos)%22%20d%3D%22M12.5%2020h5.25A2.25%202.25%200%200%201%2020%2022.25v7.5A2.25%202.25%200%200%201%2017.75%2032H12.5L11%2026z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGVIzj3dos)%22%20d%3D%22m35.5%2031.624l1.5-5.812L35.5%2020h-5.25A2.25%202.25%200%200%200%2028%2022.25v7.5A2.25%202.25%200%200%200%2030.25%2032h3.5c.624%200%201.216-.134%201.75-.376%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG6z3Kpbcn)%22%20d%3D%22M12.5%2020H10v12h2.5z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG6z3Kpbcn)%22%20d%3D%22M35.5%2031.624A4.25%204.25%200%200%200%2038%2027.75V20h-2.5z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGiutpwccN%22%20x1%3D%2215.833%22%20x2%3D%2212.993%22%20y1%3D%2238.708%22%20y2%3D%2230.977%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%239ca5ad%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGIC7IqcNR%22%20x1%3D%2227.75%22%20x2%3D%2219.279%22%20y1%3D%2242.75%22%20y2%3D%2237.802%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23383b3d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGRUYlseqW%22%20x1%3D%220%22%20x2%3D%223.354%22%20y1%3D%224%22%20y2%3D%2218.391%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23b9c0c7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2370777d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGVIzj3dos%22%20x1%3D%2224%22%20x2%3D%2224%22%20y1%3D%2220%22%20y2%3D%2232%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230fafff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230067bf%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG6z3Kpbcn%22%20x1%3D%2224%22%20x2%3D%2223.718%22%20y1%3D%2220%22%20y2%3D%2231.993%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230078d4%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%232052cb%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/headset-48.svg?color=%231a73e8&size=48
