mention icon

mention from Octicons by GitHub · Regular · MIT Free for personal and commercial use.

Name: mention
Set: Octicons
Style: Regular
Viewbox: 14×16
License: MIT

2 other variants in Octicons

The same icon in other sets

mentionAkar Icons mentionCodicons mention-12-filledFluent UI System Icons mentionSVG Logos

Use the mention icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M6.58 15c1.25 0 2.52-.31 3.56-.94l-.42-.94c-.84.52-1.89.83-3.03.83c-3.23 0-5.64-2.08-5.64-5.72c0-4.37 3.23-7.18 6.58-7.18c3.45 0 5.22 2.19 5.22 5.2c0 2.39-1.34 3.86-2.5 3.86c-1.05 0-1.36-.73-1.05-2.19l.73-3.75H8.98l-.11.72c-.41-.63-.94-.83-1.56-.83c-2.19 0-3.66 2.39-3.66 4.38c0 1.67.94 2.61 2.3 2.61c.84 0 1.67-.53 2.3-1.25c.11.94.94 1.45 1.98 1.45c1.67 0 3.77-1.67 3.77-5C14 2.61 11.59 0 7.83 0C3.66 0 0 3.33 0 8.33C0 12.71 2.92 15 6.58 15zm-.31-5c-.73 0-1.36-.52-1.36-1.67c0-1.45.94-3.22 2.41-3.22c.52 0 .84.2 1.25.83l-.52 3.02c-.63.73-1.25 1.05-1.78 1.05V10z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function OcticonMention(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 14 16"><path fillRule="evenodd" d="M6.58 15c1.25 0 2.52-.31 3.56-.94l-.42-.94c-.84.52-1.89.83-3.03.83c-3.23 0-5.64-2.08-5.64-5.72c0-4.37 3.23-7.18 6.58-7.18c3.45 0 5.22 2.19 5.22 5.2c0 2.39-1.34 3.86-2.5 3.86c-1.05 0-1.36-.73-1.05-2.19l.73-3.75H8.98l-.11.72c-.41-.63-.94-.83-1.56-.83c-2.19 0-3.66 2.39-3.66 4.38c0 1.67.94 2.61 2.3 2.61c.84 0 1.67-.53 2.3-1.25c.11.94.94 1.45 1.98 1.45c1.67 0 3.77-1.67 3.77-5C14 2.61 11.59 0 7.83 0C3.66 0 0 3.33 0 8.33C0 12.71 2.92 15 6.58 15zm-.31-5c-.73 0-1.36-.52-1.36-1.67c0-1.45.94-3.22 2.41-3.22c.52 0 .84.2 1.25.83l-.52 3.02c-.63.73-1.25 1.05-1.78 1.05V10z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M6.58 15c1.25 0 2.52-.31 3.56-.94l-.42-.94c-.84.52-1.89.83-3.03.83c-3.23 0-5.64-2.08-5.64-5.72c0-4.37 3.23-7.18 6.58-7.18c3.45 0 5.22 2.19 5.22 5.2c0 2.39-1.34 3.86-2.5 3.86c-1.05 0-1.36-.73-1.05-2.19l.73-3.75H8.98l-.11.72c-.41-.63-.94-.83-1.56-.83c-2.19 0-3.66 2.39-3.66 4.38c0 1.67.94 2.61 2.3 2.61c.84 0 1.67-.53 2.3-1.25c.11.94.94 1.45 1.98 1.45c1.67 0 3.77-1.67 3.77-5C14 2.61 11.59 0 7.83 0C3.66 0 0 3.33 0 8.33C0 12.71 2.92 15 6.58 15zm-.31-5c-.73 0-1.36-.52-1.36-1.67c0-1.45.94-3.22 2.41-3.22c.52 0 .84.2 1.25.83l-.52 3.02c-.63.73-1.25 1.05-1.78 1.05V10z" fill="currentColor"/></svg>
</template>

CSS

.icon-mention {
  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%2014%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M6.58%2015c1.25%200%202.52-.31%203.56-.94l-.42-.94c-.84.52-1.89.83-3.03.83c-3.23%200-5.64-2.08-5.64-5.72c0-4.37%203.23-7.18%206.58-7.18c3.45%200%205.22%202.19%205.22%205.2c0%202.39-1.34%203.86-2.5%203.86c-1.05%200-1.36-.73-1.05-2.19l.73-3.75H8.98l-.11.72c-.41-.63-.94-.83-1.56-.83c-2.19%200-3.66%202.39-3.66%204.38c0%201.67.94%202.61%202.3%202.61c.84%200%201.67-.53%202.3-1.25c.11.94.94%201.45%201.98%201.45c1.67%200%203.77-1.67%203.77-5C14%202.61%2011.59%200%207.83%200C3.66%200%200%203.33%200%208.33C0%2012.71%202.92%2015%206.58%2015zm-.31-5c-.73%200-1.36-.52-1.36-1.67c0-1.45.94-3.22%202.41-3.22c.52%200%20.84.2%201.25.83l-.52%203.02c-.63.73-1.25%201.05-1.78%201.05V10z%22%20fill%3D%22currentColor%22%2F%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%2014%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M6.58%2015c1.25%200%202.52-.31%203.56-.94l-.42-.94c-.84.52-1.89.83-3.03.83c-3.23%200-5.64-2.08-5.64-5.72c0-4.37%203.23-7.18%206.58-7.18c3.45%200%205.22%202.19%205.22%205.2c0%202.39-1.34%203.86-2.5%203.86c-1.05%200-1.36-.73-1.05-2.19l.73-3.75H8.98l-.11.72c-.41-.63-.94-.83-1.56-.83c-2.19%200-3.66%202.39-3.66%204.38c0%201.67.94%202.61%202.3%202.61c.84%200%201.67-.53%202.3-1.25c.11.94.94%201.45%201.98%201.45c1.67%200%203.77-1.67%203.77-5C14%202.61%2011.59%200%207.83%200C3.66%200%200%203.33%200%208.33C0%2012.71%202.92%2015%206.58%2015zm-.31-5c-.73%200-1.36-.52-1.36-1.67c0-1.45.94-3.22%202.41-3.22c.52%200%20.84.2%201.25.83l-.52%203.02c-.63.73-1.25%201.05-1.78%201.05V10z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/octicon/mention.svg?color=%231a73e8&size=48