at symbol icon
at-symbol from Majesticons by Gerrit Halfmann · Solid · MIT Free for personal and commercial use.
- Name
- at-symbol
- Set
- Majesticons
- Style
- Solid
- Viewbox
- 24×24
- License
- MIT
1 other variant in Majesticons
The same icon in other sets
Use the at symbol icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 23c6.075 0 11-4.925 11-11S18.075 1 12 1S1 5.925 1 12s4.925 11 11 11zM4.788 6.416C6.174 4.492 8.474 3 12 3s5.826 1.492 7.212 3.416C20.56 8.289 21 10.506 21 12c0 .631-.152 1.603-.743 2.448C19.625 15.351 18.563 16 17 16c-1.037 0-1.74-.531-2.186-1.157A4 4 0 1 1 16 12c0 .403.086.993.302 1.442c.204.427.423.558.698.558c.937 0 1.375-.351 1.618-.698c.284-.405.382-.933.382-1.302c0-1.173-.36-2.956-1.412-4.416C16.575 6.175 14.874 5 12 5S7.426 6.175 6.412 7.584C5.36 9.044 5 10.827 5 12c0 1.173.36 2.956 1.412 4.416C7.426 17.825 9.126 19 12 19c1.98 0 3.385-.558 4.388-1.334a1 1 0 1 1 1.224 1.581C16.229 20.317 14.385 21 12 21c-3.526 0-5.826-1.491-7.212-3.416C3.44 15.711 3 13.494 3 12c0-1.493.44-3.711 1.788-5.584zM12 10a2 2 0 1 1 0 4a2 2 0 0 1 0-4z" fill="currentColor"/></g></svg>
React
import type { SVGProps } from "react";
export function MajesticonsAtSymbol(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fillRule="evenodd" clipRule="evenodd" d="M12 23c6.075 0 11-4.925 11-11S18.075 1 12 1S1 5.925 1 12s4.925 11 11 11zM4.788 6.416C6.174 4.492 8.474 3 12 3s5.826 1.492 7.212 3.416C20.56 8.289 21 10.506 21 12c0 .631-.152 1.603-.743 2.448C19.625 15.351 18.563 16 17 16c-1.037 0-1.74-.531-2.186-1.157A4 4 0 1 1 16 12c0 .403.086.993.302 1.442c.204.427.423.558.698.558c.937 0 1.375-.351 1.618-.698c.284-.405.382-.933.382-1.302c0-1.173-.36-2.956-1.412-4.416C16.575 6.175 14.874 5 12 5S7.426 6.175 6.412 7.584C5.36 9.044 5 10.827 5 12c0 1.173.36 2.956 1.412 4.416C7.426 17.825 9.126 19 12 19c1.98 0 3.385-.558 4.388-1.334a1 1 0 1 1 1.224 1.581C16.229 20.317 14.385 21 12 21c-3.526 0-5.826-1.491-7.212-3.416C3.44 15.711 3 13.494 3 12c0-1.493.44-3.711 1.788-5.584zM12 10a2 2 0 1 1 0 4a2 2 0 0 1 0-4z" fill="currentColor"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 23c6.075 0 11-4.925 11-11S18.075 1 12 1S1 5.925 1 12s4.925 11 11 11zM4.788 6.416C6.174 4.492 8.474 3 12 3s5.826 1.492 7.212 3.416C20.56 8.289 21 10.506 21 12c0 .631-.152 1.603-.743 2.448C19.625 15.351 18.563 16 17 16c-1.037 0-1.74-.531-2.186-1.157A4 4 0 1 1 16 12c0 .403.086.993.302 1.442c.204.427.423.558.698.558c.937 0 1.375-.351 1.618-.698c.284-.405.382-.933.382-1.302c0-1.173-.36-2.956-1.412-4.416C16.575 6.175 14.874 5 12 5S7.426 6.175 6.412 7.584C5.36 9.044 5 10.827 5 12c0 1.173.36 2.956 1.412 4.416C7.426 17.825 9.126 19 12 19c1.98 0 3.385-.558 4.388-1.334a1 1 0 1 1 1.224 1.581C16.229 20.317 14.385 21 12 21c-3.526 0-5.826-1.491-7.212-3.416C3.44 15.711 3 13.494 3 12c0-1.493.44-3.711 1.788-5.584zM12 10a2 2 0 1 1 0 4a2 2 0 0 1 0-4z" fill="currentColor"/></g></svg> </template>
CSS
.icon-at-symbol {
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%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12%2023c6.075%200%2011-4.925%2011-11S18.075%201%2012%201S1%205.925%201%2012s4.925%2011%2011%2011zM4.788%206.416C6.174%204.492%208.474%203%2012%203s5.826%201.492%207.212%203.416C20.56%208.289%2021%2010.506%2021%2012c0%20.631-.152%201.603-.743%202.448C19.625%2015.351%2018.563%2016%2017%2016c-1.037%200-1.74-.531-2.186-1.157A4%204%200%201%201%2016%2012c0%20.403.086.993.302%201.442c.204.427.423.558.698.558c.937%200%201.375-.351%201.618-.698c.284-.405.382-.933.382-1.302c0-1.173-.36-2.956-1.412-4.416C16.575%206.175%2014.874%205%2012%205S7.426%206.175%206.412%207.584C5.36%209.044%205%2010.827%205%2012c0%201.173.36%202.956%201.412%204.416C7.426%2017.825%209.126%2019%2012%2019c1.98%200%203.385-.558%204.388-1.334a1%201%200%201%201%201.224%201.581C16.229%2020.317%2014.385%2021%2012%2021c-3.526%200-5.826-1.491-7.212-3.416C3.44%2015.711%203%2013.494%203%2012c0-1.493.44-3.711%201.788-5.584zM12%2010a2%202%200%201%201%200%204a2%202%200%200%201%200-4z%22%20fill%3D%22currentColor%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%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12%2023c6.075%200%2011-4.925%2011-11S18.075%201%2012%201S1%205.925%201%2012s4.925%2011%2011%2011zM4.788%206.416C6.174%204.492%208.474%203%2012%203s5.826%201.492%207.212%203.416C20.56%208.289%2021%2010.506%2021%2012c0%20.631-.152%201.603-.743%202.448C19.625%2015.351%2018.563%2016%2017%2016c-1.037%200-1.74-.531-2.186-1.157A4%204%200%201%201%2016%2012c0%20.403.086.993.302%201.442c.204.427.423.558.698.558c.937%200%201.375-.351%201.618-.698c.284-.405.382-.933.382-1.302c0-1.173-.36-2.956-1.412-4.416C16.575%206.175%2014.874%205%2012%205S7.426%206.175%206.412%207.584C5.36%209.044%205%2010.827%205%2012c0%201.173.36%202.956%201.412%204.416C7.426%2017.825%209.126%2019%2012%2019c1.98%200%203.385-.558%204.388-1.334a1%201%200%201%201%201.224%201.581C16.229%2020.317%2014.385%2021%2012%2021c-3.526%200-5.826-1.491-7.212-3.416C3.44%2015.711%203%2013.494%203%2012c0-1.493.44-3.711%201.788-5.584zM12%2010a2%202%200%201%201%200%204a2%202%200%200%201%200-4z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/majesticons/at-symbol.svg?color=%231a73e8&size=48
