at sign icon

at-sign-filled from Reicon by REICON · Filled · Messages · MIT Free for personal and commercial use.

Name
at-sign-filled
Set
Reicon
Style
Filled
Category
Messages
Viewbox
24×24
License
MIT

1 other variant in Reicon

The same icon in other sets

All at sign icons →

More messages icons from Reicon

Use the at sign icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M11.833 17C9.168 17 7 14.683 7 11.833s2.168-5.166 4.833-5.166s4.834 2.317 4.834 5.166S14.499 17 11.833 17m0-8.333C10.271 8.667 9 10.087 9 11.833S10.27 15 11.833 15s2.834-1.42 2.834-3.167s-1.271-3.166-2.834-3.166"/><path d="M12.481 22.665c-3.977 0-7.781-2.206-9.638-5.897c-2.427-4.821-.912-10.7 3.521-13.676C11.34-.251 17.832 1.548 20.545 5.249c2 2.724 2.32 6.794.747 9.464c-1.288 2.19-3.29 2.782-4.695 2.398c-1.172-.32-1.929-1.314-1.929-2.532V7.667a1 1 0 0 1 2 0v6.912c0 .205.047.492.455.602c.545.152 1.646-.124 2.446-1.482c1.174-1.991.894-5.182-.636-7.267c-2.172-2.964-7.53-4.31-11.453-1.679c-3.539 2.376-4.79 7.259-2.85 11.115c1.947 3.868 6.522 5.73 10.645 4.337a1 1 0 0 1 .641 1.895a10.7 10.7 0 0 1-3.433.565Z"/></g></svg>

React

import type { SVGProps } from "react";

export function ReiconAtSignFilled(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M11.833 17C9.168 17 7 14.683 7 11.833s2.168-5.166 4.833-5.166s4.834 2.317 4.834 5.166S14.499 17 11.833 17m0-8.333C10.271 8.667 9 10.087 9 11.833S10.27 15 11.833 15s2.834-1.42 2.834-3.167s-1.271-3.166-2.834-3.166"/><path d="M12.481 22.665c-3.977 0-7.781-2.206-9.638-5.897c-2.427-4.821-.912-10.7 3.521-13.676C11.34-.251 17.832 1.548 20.545 5.249c2 2.724 2.32 6.794.747 9.464c-1.288 2.19-3.29 2.782-4.695 2.398c-1.172-.32-1.929-1.314-1.929-2.532V7.667a1 1 0 0 1 2 0v6.912c0 .205.047.492.455.602c.545.152 1.646-.124 2.446-1.482c1.174-1.991.894-5.182-.636-7.267c-2.172-2.964-7.53-4.31-11.453-1.679c-3.539 2.376-4.79 7.259-2.85 11.115c1.947 3.868 6.522 5.73 10.645 4.337a1 1 0 0 1 .641 1.895a10.7 10.7 0 0 1-3.433.565Z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M11.833 17C9.168 17 7 14.683 7 11.833s2.168-5.166 4.833-5.166s4.834 2.317 4.834 5.166S14.499 17 11.833 17m0-8.333C10.271 8.667 9 10.087 9 11.833S10.27 15 11.833 15s2.834-1.42 2.834-3.167s-1.271-3.166-2.834-3.166"/><path d="M12.481 22.665c-3.977 0-7.781-2.206-9.638-5.897c-2.427-4.821-.912-10.7 3.521-13.676C11.34-.251 17.832 1.548 20.545 5.249c2 2.724 2.32 6.794.747 9.464c-1.288 2.19-3.29 2.782-4.695 2.398c-1.172-.32-1.929-1.314-1.929-2.532V7.667a1 1 0 0 1 2 0v6.912c0 .205.047.492.455.602c.545.152 1.646-.124 2.446-1.482c1.174-1.991.894-5.182-.636-7.267c-2.172-2.964-7.53-4.31-11.453-1.679c-3.539 2.376-4.79 7.259-2.85 11.115c1.947 3.868 6.522 5.73 10.645 4.337a1 1 0 0 1 .641 1.895a10.7 10.7 0 0 1-3.433.565Z"/></g></svg>
</template>

CSS

.icon-at-sign-filled {
  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%2024%2024%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M11.833%2017C9.168%2017%207%2014.683%207%2011.833s2.168-5.166%204.833-5.166s4.834%202.317%204.834%205.166S14.499%2017%2011.833%2017m0-8.333C10.271%208.667%209%2010.087%209%2011.833S10.27%2015%2011.833%2015s2.834-1.42%202.834-3.167s-1.271-3.166-2.834-3.166%22%2F%3E%3Cpath%20d%3D%22M12.481%2022.665c-3.977%200-7.781-2.206-9.638-5.897c-2.427-4.821-.912-10.7%203.521-13.676C11.34-.251%2017.832%201.548%2020.545%205.249c2%202.724%202.32%206.794.747%209.464c-1.288%202.19-3.29%202.782-4.695%202.398c-1.172-.32-1.929-1.314-1.929-2.532V7.667a1%201%200%200%201%202%200v6.912c0%20.205.047.492.455.602c.545.152%201.646-.124%202.446-1.482c1.174-1.991.894-5.182-.636-7.267c-2.172-2.964-7.53-4.31-11.453-1.679c-3.539%202.376-4.79%207.259-2.85%2011.115c1.947%203.868%206.522%205.73%2010.645%204.337a1%201%200%200%201%20.641%201.895a10.7%2010.7%200%200%201-3.433.565Z%22%2F%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%2024%2024%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M11.833%2017C9.168%2017%207%2014.683%207%2011.833s2.168-5.166%204.833-5.166s4.834%202.317%204.834%205.166S14.499%2017%2011.833%2017m0-8.333C10.271%208.667%209%2010.087%209%2011.833S10.27%2015%2011.833%2015s2.834-1.42%202.834-3.167s-1.271-3.166-2.834-3.166%22%2F%3E%3Cpath%20d%3D%22M12.481%2022.665c-3.977%200-7.781-2.206-9.638-5.897c-2.427-4.821-.912-10.7%203.521-13.676C11.34-.251%2017.832%201.548%2020.545%205.249c2%202.724%202.32%206.794.747%209.464c-1.288%202.19-3.29%202.782-4.695%202.398c-1.172-.32-1.929-1.314-1.929-2.532V7.667a1%201%200%200%201%202%200v6.912c0%20.205.047.492.455.602c.545.152%201.646-.124%202.446-1.482c1.174-1.991.894-5.182-.636-7.267c-2.172-2.964-7.53-4.31-11.453-1.679c-3.539%202.376-4.79%207.259-2.85%2011.115c1.947%203.868%206.522%205.73%2010.645%204.337a1%201%200%200%201%20.641%201.895a10.7%2010.7%200%200%201-3.433.565Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/at-sign-filled.svg?color=%231a73e8&size=48