authenticator icon

authenticator from Material Symbols by Google · Regular · Apache-2.0 Free for personal and commercial use.

Name
authenticator
Set
Material Symbols
Style
Regular
Viewbox
24×24
License
Apache 2.0

Use the authenticator icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 22q-2.075 0-3.9-.788q-1.825-.787-3.175-2.137q-1.35-1.35-2.137-3.175Q2 14.075 2 12t.788-3.9q.787-1.825 2.137-3.175q1.35-1.35 3.175-2.138Q9.925 2 12 2t3.9.787q1.825.788 3.175 2.138L16.25 7.75q-.8-.825-1.9-1.287Q13.25 6 12 6Q9.5 6 7.75 7.75T6 12q0 2.5 1.75 4.25T12 18q1.375 0 2.8-.688q1.425-.687 2.375-2.312h4.35q-.1.35-.625 1.488q-.525 1.137-1.637 2.362q-1.113 1.225-2.875 2.188Q14.625 22 12 22Zm0-17q.425 0 .713-.288Q13 4.425 13 4t-.287-.713Q12.425 3 12 3t-.712.287Q11 3.575 11 4t.288.712Q11.575 5 12 5ZM5.65 7.05q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM4 13q.425 0 .713-.288Q5 12.425 5 12t-.287-.713Q4.425 11 4 11t-.712.287Q3 11.575 3 12t.288.712Q3.575 13 4 13Zm1.65 5.35q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM12 21q.425 0 .713-.288Q13 20.425 13 20t-.287-.712Q12.425 19 12 19t-.712.288Q11 19.575 11 20t.288.712Q11.575 21 12 21Zm0-8q-.425 0-.712-.288Q11 12.425 11 12t.288-.713Q11.575 11 12 11h8q.425 0 .712.287q.288.288.288.713t-.288.712Q20.425 13 20 13Z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsAuthenticator(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 22q-2.075 0-3.9-.788q-1.825-.787-3.175-2.137q-1.35-1.35-2.137-3.175Q2 14.075 2 12t.788-3.9q.787-1.825 2.137-3.175q1.35-1.35 3.175-2.138Q9.925 2 12 2t3.9.787q1.825.788 3.175 2.138L16.25 7.75q-.8-.825-1.9-1.287Q13.25 6 12 6Q9.5 6 7.75 7.75T6 12q0 2.5 1.75 4.25T12 18q1.375 0 2.8-.688q1.425-.687 2.375-2.312h4.35q-.1.35-.625 1.488q-.525 1.137-1.637 2.362q-1.113 1.225-2.875 2.188Q14.625 22 12 22Zm0-17q.425 0 .713-.288Q13 4.425 13 4t-.287-.713Q12.425 3 12 3t-.712.287Q11 3.575 11 4t.288.712Q11.575 5 12 5ZM5.65 7.05q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM4 13q.425 0 .713-.288Q5 12.425 5 12t-.287-.713Q4.425 11 4 11t-.712.287Q3 11.575 3 12t.288.712Q3.575 13 4 13Zm1.65 5.35q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM12 21q.425 0 .713-.288Q13 20.425 13 20t-.287-.712Q12.425 19 12 19t-.712.288Q11 19.575 11 20t.288.712Q11.575 21 12 21Zm0-8q-.425 0-.712-.288Q11 12.425 11 12t.288-.713Q11.575 11 12 11h8q.425 0 .712.287q.288.288.288.713t-.288.712Q20.425 13 20 13Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 22q-2.075 0-3.9-.788q-1.825-.787-3.175-2.137q-1.35-1.35-2.137-3.175Q2 14.075 2 12t.788-3.9q.787-1.825 2.137-3.175q1.35-1.35 3.175-2.138Q9.925 2 12 2t3.9.787q1.825.788 3.175 2.138L16.25 7.75q-.8-.825-1.9-1.287Q13.25 6 12 6Q9.5 6 7.75 7.75T6 12q0 2.5 1.75 4.25T12 18q1.375 0 2.8-.688q1.425-.687 2.375-2.312h4.35q-.1.35-.625 1.488q-.525 1.137-1.637 2.362q-1.113 1.225-2.875 2.188Q14.625 22 12 22Zm0-17q.425 0 .713-.288Q13 4.425 13 4t-.287-.713Q12.425 3 12 3t-.712.287Q11 3.575 11 4t.288.712Q11.575 5 12 5ZM5.65 7.05q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM4 13q.425 0 .713-.288Q5 12.425 5 12t-.287-.713Q4.425 11 4 11t-.712.287Q3 11.575 3 12t.288.712Q3.575 13 4 13Zm1.65 5.35q.3.3.7.3q.4 0 .7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4 0-.7.3q-.3.3-.3.7q0 .4.3.7ZM12 21q.425 0 .713-.288Q13 20.425 13 20t-.287-.712Q12.425 19 12 19t-.712.288Q11 19.575 11 20t.288.712Q11.575 21 12 21Zm0-8q-.425 0-.712-.288Q11 12.425 11 12t.288-.713Q11.575 11 12 11h8q.425 0 .712.287q.288.288.288.713t-.288.712Q20.425 13 20 13Z"/></svg>
</template>

CSS

.icon-authenticator {
  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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%2022q-2.075%200-3.9-.788q-1.825-.787-3.175-2.137q-1.35-1.35-2.137-3.175Q2%2014.075%202%2012t.788-3.9q.787-1.825%202.137-3.175q1.35-1.35%203.175-2.138Q9.925%202%2012%202t3.9.787q1.825.788%203.175%202.138L16.25%207.75q-.8-.825-1.9-1.287Q13.25%206%2012%206Q9.5%206%207.75%207.75T6%2012q0%202.5%201.75%204.25T12%2018q1.375%200%202.8-.688q1.425-.687%202.375-2.312h4.35q-.1.35-.625%201.488q-.525%201.137-1.637%202.362q-1.113%201.225-2.875%202.188Q14.625%2022%2012%2022Zm0-17q.425%200%20.713-.288Q13%204.425%2013%204t-.287-.713Q12.425%203%2012%203t-.712.287Q11%203.575%2011%204t.288.712Q11.575%205%2012%205ZM5.65%207.05q.3.3.7.3q.4%200%20.7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4%200-.7.3q-.3.3-.3.7q0%20.4.3.7ZM4%2013q.425%200%20.713-.288Q5%2012.425%205%2012t-.287-.713Q4.425%2011%204%2011t-.712.287Q3%2011.575%203%2012t.288.712Q3.575%2013%204%2013Zm1.65%205.35q.3.3.7.3q.4%200%20.7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4%200-.7.3q-.3.3-.3.7q0%20.4.3.7ZM12%2021q.425%200%20.713-.288Q13%2020.425%2013%2020t-.287-.712Q12.425%2019%2012%2019t-.712.288Q11%2019.575%2011%2020t.288.712Q11.575%2021%2012%2021Zm0-8q-.425%200-.712-.288Q11%2012.425%2011%2012t.288-.713Q11.575%2011%2012%2011h8q.425%200%20.712.287q.288.288.288.713t-.288.712Q20.425%2013%2020%2013Z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%2022q-2.075%200-3.9-.788q-1.825-.787-3.175-2.137q-1.35-1.35-2.137-3.175Q2%2014.075%202%2012t.788-3.9q.787-1.825%202.137-3.175q1.35-1.35%203.175-2.138Q9.925%202%2012%202t3.9.787q1.825.788%203.175%202.138L16.25%207.75q-.8-.825-1.9-1.287Q13.25%206%2012%206Q9.5%206%207.75%207.75T6%2012q0%202.5%201.75%204.25T12%2018q1.375%200%202.8-.688q1.425-.687%202.375-2.312h4.35q-.1.35-.625%201.488q-.525%201.137-1.637%202.362q-1.113%201.225-2.875%202.188Q14.625%2022%2012%2022Zm0-17q.425%200%20.713-.288Q13%204.425%2013%204t-.287-.713Q12.425%203%2012%203t-.712.287Q11%203.575%2011%204t.288.712Q11.575%205%2012%205ZM5.65%207.05q.3.3.7.3q.4%200%20.7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4%200-.7.3q-.3.3-.3.7q0%20.4.3.7ZM4%2013q.425%200%20.713-.288Q5%2012.425%205%2012t-.287-.713Q4.425%2011%204%2011t-.712.287Q3%2011.575%203%2012t.288.712Q3.575%2013%204%2013Zm1.65%205.35q.3.3.7.3q.4%200%20.7-.3q.3-.3.3-.7q0-.4-.3-.7q-.3-.3-.7-.3q-.4%200-.7.3q-.3.3-.3.7q0%20.4.3.7ZM12%2021q.425%200%20.713-.288Q13%2020.425%2013%2020t-.287-.712Q12.425%2019%2012%2019t-.712.288Q11%2019.575%2011%2020t.288.712Q11.575%2021%2012%2021Zm0-8q-.425%200-.712-.288Q11%2012.425%2011%2012t.288-.713Q11.575%2011%2012%2011h8q.425%200%20.712.287q.288.288.288.713t-.288.712Q20.425%2013%2020%2013Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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