gentleface

Gentleface › People & accounts › user-headset

user-headset icon

User headset: support agent, contact center agent, call center agent, live agent. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Code line-round

SVG
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M14 11L13.5 11C13.359 11 13.241 10.952 13.144 10.856C13.048 10.759 13 10.641 13 10.5L13 8.5C13 8.359 13.048 8.241 13.144 8.144C13.241 8.048 13.359 8 13.5 8L14 8C14 7.237 13.86 6.501 13.579 5.791C13.274 5.021 12.828 4.343 12.243 3.757C11.657 3.172 10.979 2.726 10.209 2.421C9.499 2.14 8.763 2 8 2C7.237 2 6.501 2.14 5.791 2.421C5.021 2.726 4.343 3.172 3.757 3.757C3.172 4.343 2.726 5.021 2.421 5.791C2.14 6.501 2 7.237 2 8L2.5 8C2.641 8 2.759 8.048 2.856 8.144C2.952 8.241 3 8.359 3 8.5L3 10.5C3 10.641 2.952 10.759 2.856 10.856C2.759 10.952 2.641 11 2.5 11L1.5 11C1.359 11 1.241 10.952 1.144 10.856C1.048 10.759 1 10.641 1 10.5L1 8C1 7.11 1.164 6.251 1.491 5.423C1.847 4.525 2.367 3.734 3.05 3.05C3.734 2.367 4.525 1.847 5.423 1.491C6.251 1.164 7.11 1 8 1C8.89 1 9.749 1.164 10.577 1.491C11.475 1.847 12.266 2.367 12.95 3.05C13.633 3.734 14.153 4.525 14.509 5.423C14.836 6.251 15 7.11 15 8L15 10.5C15 10.641 14.952 10.759 14.856 10.856C14.759 10.952 14.641 11 14.5 11L14.55 11C14.799 11 15 11.201 15 11.45L15 12.5C15 12.818 14.941 13.125 14.824 13.42C14.697 13.741 14.512 14.024 14.268 14.268C14.024 14.512 13.741 14.697 13.42 14.824C13.125 14.941 12.818 15 12.5 15L9.5 15C9.359 15 9.241 14.952 9.144 14.856C9.048 14.759 9 14.641 9 14.5C9 14.359 9.048 14.241 9.144 14.144C9.241 14.048 9.359 14 9.5 14L12.5 14C12.691 14 12.875 13.965 13.052 13.895C13.245 13.818 13.414 13.707 13.561 13.561C13.707 13.414 13.818 13.245 13.895 13.052C13.965 12.875 14 12.691 14 12.5L14 11.447C14 11.431 14.001 11.414 14.003 11.397C14.018 11.265 14.09 11.147 14.2 11.073C14.128 11.065 14.06 11.04 14 11ZM5.13 4.511C5.518 4.013 5.969 3.633 6.485 3.37C6.97 3.123 7.475 3 8 3C8.525 3 9.03 3.123 9.515 3.37C10.031 3.633 10.482 4.013 10.87 4.511C11.249 4.999 11.536 5.56 11.732 6.196C11.911 6.776 12 7.378 12 8C12 8.622 11.911 9.224 11.732 9.804C11.536 10.44 11.249 11.001 10.87 11.489C10.482 11.987 10.031 12.367 9.515 12.63C9.03 12.877 8.525 13 8 13C7.475 13 6.97 12.877 6.485 12.63C5.969 12.367 5.518 11.987 5.13 11.489C4.751 11.001 4.464 10.44 4.268 9.804C4.089 9.224 4 8.622 4 8C4 7.378 4.089 6.776 4.268 6.196C4.464 5.56 4.751 4.999 5.13 4.511ZM11 7.979C10.133 7.903 9.388 7.642 8.766 7.197C8.153 6.758 7.731 6.192 7.5 5.5C7.3 6.101 6.948 6.632 6.446 7.094C5.988 7.514 5.507 7.793 5 7.928C5 7.952 5 7.976 5 8C5 8.522 5.075 9.025 5.224 9.509C5.384 10.029 5.616 10.484 5.92 10.875C6.216 11.256 6.555 11.543 6.938 11.738C7.281 11.913 7.635 12 8 12C8.365 12 8.719 11.913 9.062 11.738C9.445 11.543 9.784 11.256 10.08 10.875C10.384 10.484 10.616 10.029 10.776 9.509C10.925 9.025 11 8.522 11 8L11 7.989L11 7.988L11 7.979Z"/></svg>
React
// Gentleface "user-headset" (line-round), MIT. https://gentleface.com/icons/user-headset
import type { SVGProps } from 'react';

export function UserHeadsetIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M14 11L13.5 11C13.359 11 13.241 10.952 13.144 10.856C13.048 10.759 13 10.641 13 10.5L13 8.5C13 8.359 13.048 8.241 13.144 8.144C13.241 8.048 13.359 8 13.5 8L14 8C14 7.237 13.86 6.501 13.579 5.791C13.274 5.021 12.828 4.343 12.243 3.757C11.657 3.172 10.979 2.726 10.209 2.421C9.499 2.14 8.763 2 8 2C7.237 2 6.501 2.14 5.791 2.421C5.021 2.726 4.343 3.172 3.757 3.757C3.172 4.343 2.726 5.021 2.421 5.791C2.14 6.501 2 7.237 2 8L2.5 8C2.641 8 2.759 8.048 2.856 8.144C2.952 8.241 3 8.359 3 8.5L3 10.5C3 10.641 2.952 10.759 2.856 10.856C2.759 10.952 2.641 11 2.5 11L1.5 11C1.359 11 1.241 10.952 1.144 10.856C1.048 10.759 1 10.641 1 10.5L1 8C1 7.11 1.164 6.251 1.491 5.423C1.847 4.525 2.367 3.734 3.05 3.05C3.734 2.367 4.525 1.847 5.423 1.491C6.251 1.164 7.11 1 8 1C8.89 1 9.749 1.164 10.577 1.491C11.475 1.847 12.266 2.367 12.95 3.05C13.633 3.734 14.153 4.525 14.509 5.423C14.836 6.251 15 7.11 15 8L15 10.5C15 10.641 14.952 10.759 14.856 10.856C14.759 10.952 14.641 11 14.5 11L14.55 11C14.799 11 15 11.201 15 11.45L15 12.5C15 12.818 14.941 13.125 14.824 13.42C14.697 13.741 14.512 14.024 14.268 14.268C14.024 14.512 13.741 14.697 13.42 14.824C13.125 14.941 12.818 15 12.5 15L9.5 15C9.359 15 9.241 14.952 9.144 14.856C9.048 14.759 9 14.641 9 14.5C9 14.359 9.048 14.241 9.144 14.144C9.241 14.048 9.359 14 9.5 14L12.5 14C12.691 14 12.875 13.965 13.052 13.895C13.245 13.818 13.414 13.707 13.561 13.561C13.707 13.414 13.818 13.245 13.895 13.052C13.965 12.875 14 12.691 14 12.5L14 11.447C14 11.431 14.001 11.414 14.003 11.397C14.018 11.265 14.09 11.147 14.2 11.073C14.128 11.065 14.06 11.04 14 11ZM5.13 4.511C5.518 4.013 5.969 3.633 6.485 3.37C6.97 3.123 7.475 3 8 3C8.525 3 9.03 3.123 9.515 3.37C10.031 3.633 10.482 4.013 10.87 4.511C11.249 4.999 11.536 5.56 11.732 6.196C11.911 6.776 12 7.378 12 8C12 8.622 11.911 9.224 11.732 9.804C11.536 10.44 11.249 11.001 10.87 11.489C10.482 11.987 10.031 12.367 9.515 12.63C9.03 12.877 8.525 13 8 13C7.475 13 6.97 12.877 6.485 12.63C5.969 12.367 5.518 11.987 5.13 11.489C4.751 11.001 4.464 10.44 4.268 9.804C4.089 9.224 4 8.622 4 8C4 7.378 4.089 6.776 4.268 6.196C4.464 5.56 4.751 4.999 5.13 4.511ZM11 7.979C10.133 7.903 9.388 7.642 8.766 7.197C8.153 6.758 7.731 6.192 7.5 5.5C7.3 6.101 6.948 6.632 6.446 7.094C5.988 7.514 5.507 7.793 5 7.928C5 7.952 5 7.976 5 8C5 8.522 5.075 9.025 5.224 9.509C5.384 10.029 5.616 10.484 5.92 10.875C6.216 11.256 6.555 11.543 6.938 11.738C7.281 11.913 7.635 12 8 12C8.365 12 8.719 11.913 9.062 11.738C9.445 11.543 9.784 11.256 10.08 10.875C10.384 10.484 10.616 10.029 10.776 9.509C10.925 9.025 11 8.522 11 8L11 7.989L11 7.988L11 7.979Z" />
    </svg>
  );
}
Vue
Vue: see /icons/user-headset.md
Svelte
Svelte: see /icons/user-headset.md
HTML img
HTML img: see /icons/user-headset.md
CSS
CSS: see /icons/user-headset.md
Data URL
Data URL: see /icons/user-headset.md
Sprite
Sprite: see /icons/user-headset.md
SwiftUI
SwiftUI: see /icons/user-headset.md
Compose
Compose: see /icons/user-headset.md
Android XML
Android XML: see /icons/user-headset.md
Flutter
Flutter: see /icons/user-headset.md

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

With npm: import { UserHeadsetIcon } from '@gentleface/react'; (setup).

Meaning

Use it for
support agent, contact center agent, call center agent, live agent
Alternatives
  • headset: the headset device, or customer support in general (headset owns customer-support)
  • bot: an AI agent (bot owns ai-agent)
Also fits
  • support chat: a support agent
  • ai call: a human support agent
  • customer support: a support agent as a person (support-agent)
Tags
support agent, contact center agent, customer support, customer service, call center, help desk, operator, headset, agent, user, person
Category
People & accounts
Component name
UserHeadsetIcon
History
  • 20 px drawn, 24 px drawn, added, released in 0.5.0
Since
version 0.5.0

Family 65

More people & accounts icons

For agents

Metadata: /icons/user-headset.json · Markdown: /icons/user-headset.md · SVG: https://gentleface.com/svg/{style}/16/user-headset.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/user-headset.png