Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: nod. Pick another to preview it and update the animated code:

Typicons · TiGroupOutline

Group Outline icon

A free group outline icon from Typicons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

Also known asusers iconpeople iconteam iconcommunity iconmembers iconcontacts icon
License
CC BY-SA 3.0 license
Project
s-ings.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/typicons/group-outline.json
components/icons/typicons-group-outline.tsx
import * as React from "react";

/**
 * Group Outline from Typicons (http://s-ings.com/typicons/), CC BY-SA 3.0.
 * Via Cuelark UI: ui.cuelark.com/icons/typicons/group-outline. Sized in em, colored by currentColor.
 */
export function TiGroupOutlineIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      version="1.2"
      baseProfile="tiny"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12 14c2.764 0 5-2.238 5-5s-2.236-5-5-5-5 2.238-5 5 2.236 5 5 5zm0-8c1.654 0 3 1.346 3 3s-1.346 3-3 3-3-1.346-3-3 1.346-3 3-3zM20 15c1.381 0 2.5-1.117 2.5-2.5 0-1.381-1.119-2.5-2.5-2.5-1.382 0-2.5 1.119-2.5 2.5 0 1.383 1.118 2.5 2.5 2.5zm0-4c.827 0 1.5.673 1.5 1.5s-.673 1.5-1.5 1.5-1.5-.673-1.5-1.5.673-1.5 1.5-1.5zM20 15.59c-1.331 0-2.332.406-2.917.969-1.115-.918-2.878-1.559-5.083-1.559-2.266 0-3.995.648-5.092 1.564-.596-.565-1.608-.975-2.908-.975-2.188 0-3.5 1.091-3.5 2.183 0 .545 1.312 1.092 3.5 1.092.604 0 1.146-.051 1.623-.133l-.04.27c0 1 2.405 2 6.417 2 3.762 0 6.417-1 6.417-2l-.021-.255c.463.073.996.118 1.604.118 2.051 0 3.5-.547 3.5-1.092 0-1.092-1.373-2.182-3.5-2.182zm-16 2.273c-1.309 0-2.068-.207-2.417-.354.239-.405 1.003-.92 2.417-.92 1.107 0 1.837.351 2.208.706l-.235.344c-.452.119-1.108.224-1.973.224zm8 1.137c-2.163 0-3.501-.312-4.184-.561.521-.678 1.918-1.439 4.184-1.439 2.169 0 3.59.761 4.148 1.425-.755.27-2.162.575-4.148.575zm8-1.137c-.914 0-1.546-.103-1.973-.213-.072-.127-.155-.252-.248-.375.356-.345 1.071-.685 2.221-.685 1.324 0 2.141.501 2.404.911-.39.163-1.205.362-2.404.362zM4 15c1.381 0 2.5-1.119 2.5-2.5 0-1.379-1.119-2.5-2.5-2.5-1.382 0-2.5 1.121-2.5 2.5 0 1.381 1.118 2.5 2.5 2.5zm0-4c.827 0 1.5.673 1.5 1.5s-.673 1.5-1.5 1.5-1.5-.673-1.5-1.5.673-1.5 1.5-1.5z"
      />
    </svg>
  );
}
With react-icons
import { TiGroupOutline } from "react-icons/ti";

export function Example() {
  return <TiGroupOutline className="size-5" />;
}
group-outline.svg
<svg
  version="1.2"
  baseProfile="tiny"
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M12 14c2.764 0 5-2.238 5-5s-2.236-5-5-5-5 2.238-5 5 2.236 5 5 5zm0-8c1.654 0 3 1.346 3 3s-1.346 3-3 3-3-1.346-3-3 1.346-3 3-3zM20 15c1.381 0 2.5-1.117 2.5-2.5 0-1.381-1.119-2.5-2.5-2.5-1.382 0-2.5 1.119-2.5 2.5 0 1.383 1.118 2.5 2.5 2.5zm0-4c.827 0 1.5.673 1.5 1.5s-.673 1.5-1.5 1.5-1.5-.673-1.5-1.5.673-1.5 1.5-1.5zM20 15.59c-1.331 0-2.332.406-2.917.969-1.115-.918-2.878-1.559-5.083-1.559-2.266 0-3.995.648-5.092 1.564-.596-.565-1.608-.975-2.908-.975-2.188 0-3.5 1.091-3.5 2.183 0 .545 1.312 1.092 3.5 1.092.604 0 1.146-.051 1.623-.133l-.04.27c0 1 2.405 2 6.417 2 3.762 0 6.417-1 6.417-2l-.021-.255c.463.073.996.118 1.604.118 2.051 0 3.5-.547 3.5-1.092 0-1.092-1.373-2.182-3.5-2.182zm-16 2.273c-1.309 0-2.068-.207-2.417-.354.239-.405 1.003-.92 2.417-.92 1.107 0 1.837.351 2.208.706l-.235.344c-.452.119-1.108.224-1.973.224zm8 1.137c-2.163 0-3.501-.312-4.184-.561.521-.678 1.918-1.439 4.184-1.439 2.169 0 3.59.761 4.148 1.425-.755.27-2.162.575-4.148.575zm8-1.137c-.914 0-1.546-.103-1.973-.213-.072-.127-.155-.252-.248-.375.356-.345 1.071-.685 2.221-.685 1.324 0 2.141.501 2.404.911-.39.163-1.205.362-2.404.362zM4 15c1.381 0 2.5-1.119 2.5-2.5 0-1.379-1.119-2.5-2.5-2.5-1.382 0-2.5 1.121-2.5 2.5 0 1.381 1.118 2.5 2.5 2.5zm0-4c.827 0 1.5.673 1.5 1.5s-.673 1.5-1.5 1.5-1.5-.673-1.5-1.5.673-1.5 1.5-1.5z"
  />
</svg>
Attribution
"Group Outline" icon from Typicons (http://s-ings.com/typicons/), licensed under CC BY-SA 3.0 license.

Related icons: users, people, team, community