locked with key emoji

locked-with-key from Emoji One (Colored) by Emoji One · Default · Objects · CC-BY-4.0 Attribution required.

Name
locked-with-key
Set
Emoji One (Colored)
Style
Default
Category
Objects
Viewbox
64×64
License
CC BY 4.0

The same emoji in other sets

locked-with-keyFluent Emojilocked-with-keyFluent Emoji Flatlocked-with-keyFluent Emoji High Contrastlocked-with-keyNoto Emojilocked-with-keyOpenMojilocked-with-keyStreamline Emojislocked-with-keyTwitter Emoji

More objects icons from Emoji One (Colored)

alarm-clockalembicamphorabackpackbalance-scaleballot-box-with-ballotbar-chartbarber-polebathtubbatterybedbellhop-bellbikiniblack-nibblue-bookbombbookmarkbookmark-tabsbookscalendarcameracamera-with-flashcandlecard-file-box

Use the locked with key emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#ffce31" d="M2 28.3v31.4C2 62.1 3.9 64 6.3 64h51.4c2.4 0 4.3-1.9 4.3-4.3V28.3z"/><path fill="#ff8736" d="M62 24c0-2.4-1.9-4.3-4.3-4.3H6.3C3.9 19.6 2 21.6 2 24v4.3h60z"/><g fill="#3e4347"><ellipse cx="12.4" cy="23.5" rx="5.9" ry="2.5"/><ellipse cx="51.6" cy="23.5" rx="5.9" ry="2.5"/></g><path fill="#dfe9ef" d="M32 0C19.1 0 8.6 10.6 8.6 23.5c0 .8 1.6 1.4 3.8 1.4v-1.4c.8-11 9.3-19.7 19.6-19.7c10.4 0 18.9 8.7 19.6 19.7v1.4c2.2 0 3.8-.6 3.8-1.4C55.4 10.6 44.9 0 32 0"/><path fill="#b0bdc6" d="M51.6 23.5C50.9 12.6 42.4 3.9 32 3.9s-18.9 8.7-19.6 19.7V25c2.2 0 4.2-.6 4.2-1.4C16.5 16.4 22.5 8 32 8s15.5 8.4 15.5 15.5c0 .8 2 1.4 4.2 1.4z"/><path fill="#3e4347" d="m36.6 56.4l-1.9-12.3c1.1-.8 1.9-2.2 1.9-3.7c0-2.5-2-4.6-4.6-4.6s-4.6 2.1-4.6 4.6c0 1.5.7 2.9 1.9 3.7l-1.9 12.3z"/><path fill="#42ade2" d="M43.2 27.3v8.2l2.3 2.2v3.8l-2.3 2.2v5l2.3 2.2v3.8l-2.3 2.2v3.4l4.7 3.8l4.7-3.8v-33C58.1 25.4 62 20.2 62 14c0-7.7-6.3-14-14.1-14s-14 6.3-14 14.1c0 6.1 3.9 11.3 9.3 13.2m9.4-17.9c0 2.6-2.1 4.6-4.6 4.6c-2.6 0-4.6-2.1-4.6-4.6c0-2.6 2.1-4.6 4.6-4.6s4.6 2.1 4.6 4.6"/></svg>

React

import type { SVGProps } from "react";

export function EmojioneLockedWithKey(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#ffce31" d="M2 28.3v31.4C2 62.1 3.9 64 6.3 64h51.4c2.4 0 4.3-1.9 4.3-4.3V28.3z"/><path fill="#ff8736" d="M62 24c0-2.4-1.9-4.3-4.3-4.3H6.3C3.9 19.6 2 21.6 2 24v4.3h60z"/><g fill="#3e4347"><ellipse cx="12.4" cy="23.5" rx="5.9" ry="2.5"/><ellipse cx="51.6" cy="23.5" rx="5.9" ry="2.5"/></g><path fill="#dfe9ef" d="M32 0C19.1 0 8.6 10.6 8.6 23.5c0 .8 1.6 1.4 3.8 1.4v-1.4c.8-11 9.3-19.7 19.6-19.7c10.4 0 18.9 8.7 19.6 19.7v1.4c2.2 0 3.8-.6 3.8-1.4C55.4 10.6 44.9 0 32 0"/><path fill="#b0bdc6" d="M51.6 23.5C50.9 12.6 42.4 3.9 32 3.9s-18.9 8.7-19.6 19.7V25c2.2 0 4.2-.6 4.2-1.4C16.5 16.4 22.5 8 32 8s15.5 8.4 15.5 15.5c0 .8 2 1.4 4.2 1.4z"/><path fill="#3e4347" d="m36.6 56.4l-1.9-12.3c1.1-.8 1.9-2.2 1.9-3.7c0-2.5-2-4.6-4.6-4.6s-4.6 2.1-4.6 4.6c0 1.5.7 2.9 1.9 3.7l-1.9 12.3z"/><path fill="#42ade2" d="M43.2 27.3v8.2l2.3 2.2v3.8l-2.3 2.2v5l2.3 2.2v3.8l-2.3 2.2v3.4l4.7 3.8l4.7-3.8v-33C58.1 25.4 62 20.2 62 14c0-7.7-6.3-14-14.1-14s-14 6.3-14 14.1c0 6.1 3.9 11.3 9.3 13.2m9.4-17.9c0 2.6-2.1 4.6-4.6 4.6c-2.6 0-4.6-2.1-4.6-4.6c0-2.6 2.1-4.6 4.6-4.6s4.6 2.1 4.6 4.6"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#ffce31" d="M2 28.3v31.4C2 62.1 3.9 64 6.3 64h51.4c2.4 0 4.3-1.9 4.3-4.3V28.3z"/><path fill="#ff8736" d="M62 24c0-2.4-1.9-4.3-4.3-4.3H6.3C3.9 19.6 2 21.6 2 24v4.3h60z"/><g fill="#3e4347"><ellipse cx="12.4" cy="23.5" rx="5.9" ry="2.5"/><ellipse cx="51.6" cy="23.5" rx="5.9" ry="2.5"/></g><path fill="#dfe9ef" d="M32 0C19.1 0 8.6 10.6 8.6 23.5c0 .8 1.6 1.4 3.8 1.4v-1.4c.8-11 9.3-19.7 19.6-19.7c10.4 0 18.9 8.7 19.6 19.7v1.4c2.2 0 3.8-.6 3.8-1.4C55.4 10.6 44.9 0 32 0"/><path fill="#b0bdc6" d="M51.6 23.5C50.9 12.6 42.4 3.9 32 3.9s-18.9 8.7-19.6 19.7V25c2.2 0 4.2-.6 4.2-1.4C16.5 16.4 22.5 8 32 8s15.5 8.4 15.5 15.5c0 .8 2 1.4 4.2 1.4z"/><path fill="#3e4347" d="m36.6 56.4l-1.9-12.3c1.1-.8 1.9-2.2 1.9-3.7c0-2.5-2-4.6-4.6-4.6s-4.6 2.1-4.6 4.6c0 1.5.7 2.9 1.9 3.7l-1.9 12.3z"/><path fill="#42ade2" d="M43.2 27.3v8.2l2.3 2.2v3.8l-2.3 2.2v5l2.3 2.2v3.8l-2.3 2.2v3.4l4.7 3.8l4.7-3.8v-33C58.1 25.4 62 20.2 62 14c0-7.7-6.3-14-14.1-14s-14 6.3-14 14.1c0 6.1 3.9 11.3 9.3 13.2m9.4-17.9c0 2.6-2.1 4.6-4.6 4.6c-2.6 0-4.6-2.1-4.6-4.6c0-2.6 2.1-4.6 4.6-4.6s4.6 2.1 4.6 4.6"/></svg>
</template>

CSS

.icon-locked-with-key {
  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%2064%2064%22%3E%3Cpath%20fill%3D%22%23ffce31%22%20d%3D%22M2%2028.3v31.4C2%2062.1%203.9%2064%206.3%2064h51.4c2.4%200%204.3-1.9%204.3-4.3V28.3z%22%2F%3E%3Cpath%20fill%3D%22%23ff8736%22%20d%3D%22M62%2024c0-2.4-1.9-4.3-4.3-4.3H6.3C3.9%2019.6%202%2021.6%202%2024v4.3h60z%22%2F%3E%3Cg%20fill%3D%22%233e4347%22%3E%3Cellipse%20cx%3D%2212.4%22%20cy%3D%2223.5%22%20rx%3D%225.9%22%20ry%3D%222.5%22%2F%3E%3Cellipse%20cx%3D%2251.6%22%20cy%3D%2223.5%22%20rx%3D%225.9%22%20ry%3D%222.5%22%2F%3E%3C%2Fg%3E%3Cpath%20fill%3D%22%23dfe9ef%22%20d%3D%22M32%200C19.1%200%208.6%2010.6%208.6%2023.5c0%20.8%201.6%201.4%203.8%201.4v-1.4c.8-11%209.3-19.7%2019.6-19.7c10.4%200%2018.9%208.7%2019.6%2019.7v1.4c2.2%200%203.8-.6%203.8-1.4C55.4%2010.6%2044.9%200%2032%200%22%2F%3E%3Cpath%20fill%3D%22%23b0bdc6%22%20d%3D%22M51.6%2023.5C50.9%2012.6%2042.4%203.9%2032%203.9s-18.9%208.7-19.6%2019.7V25c2.2%200%204.2-.6%204.2-1.4C16.5%2016.4%2022.5%208%2032%208s15.5%208.4%2015.5%2015.5c0%20.8%202%201.4%204.2%201.4z%22%2F%3E%3Cpath%20fill%3D%22%233e4347%22%20d%3D%22m36.6%2056.4l-1.9-12.3c1.1-.8%201.9-2.2%201.9-3.7c0-2.5-2-4.6-4.6-4.6s-4.6%202.1-4.6%204.6c0%201.5.7%202.9%201.9%203.7l-1.9%2012.3z%22%2F%3E%3Cpath%20fill%3D%22%2342ade2%22%20d%3D%22M43.2%2027.3v8.2l2.3%202.2v3.8l-2.3%202.2v5l2.3%202.2v3.8l-2.3%202.2v3.4l4.7%203.8l4.7-3.8v-33C58.1%2025.4%2062%2020.2%2062%2014c0-7.7-6.3-14-14.1-14s-14%206.3-14%2014.1c0%206.1%203.9%2011.3%209.3%2013.2m9.4-17.9c0%202.6-2.1%204.6-4.6%204.6c-2.6%200-4.6-2.1-4.6-4.6c0-2.6%202.1-4.6%204.6-4.6s4.6%202.1%204.6%204.6%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%2064%2064%22%3E%3Cpath%20fill%3D%22%23ffce31%22%20d%3D%22M2%2028.3v31.4C2%2062.1%203.9%2064%206.3%2064h51.4c2.4%200%204.3-1.9%204.3-4.3V28.3z%22%2F%3E%3Cpath%20fill%3D%22%23ff8736%22%20d%3D%22M62%2024c0-2.4-1.9-4.3-4.3-4.3H6.3C3.9%2019.6%202%2021.6%202%2024v4.3h60z%22%2F%3E%3Cg%20fill%3D%22%233e4347%22%3E%3Cellipse%20cx%3D%2212.4%22%20cy%3D%2223.5%22%20rx%3D%225.9%22%20ry%3D%222.5%22%2F%3E%3Cellipse%20cx%3D%2251.6%22%20cy%3D%2223.5%22%20rx%3D%225.9%22%20ry%3D%222.5%22%2F%3E%3C%2Fg%3E%3Cpath%20fill%3D%22%23dfe9ef%22%20d%3D%22M32%200C19.1%200%208.6%2010.6%208.6%2023.5c0%20.8%201.6%201.4%203.8%201.4v-1.4c.8-11%209.3-19.7%2019.6-19.7c10.4%200%2018.9%208.7%2019.6%2019.7v1.4c2.2%200%203.8-.6%203.8-1.4C55.4%2010.6%2044.9%200%2032%200%22%2F%3E%3Cpath%20fill%3D%22%23b0bdc6%22%20d%3D%22M51.6%2023.5C50.9%2012.6%2042.4%203.9%2032%203.9s-18.9%208.7-19.6%2019.7V25c2.2%200%204.2-.6%204.2-1.4C16.5%2016.4%2022.5%208%2032%208s15.5%208.4%2015.5%2015.5c0%20.8%202%201.4%204.2%201.4z%22%2F%3E%3Cpath%20fill%3D%22%233e4347%22%20d%3D%22m36.6%2056.4l-1.9-12.3c1.1-.8%201.9-2.2%201.9-3.7c0-2.5-2-4.6-4.6-4.6s-4.6%202.1-4.6%204.6c0%201.5.7%202.9%201.9%203.7l-1.9%2012.3z%22%2F%3E%3Cpath%20fill%3D%22%2342ade2%22%20d%3D%22M43.2%2027.3v8.2l2.3%202.2v3.8l-2.3%202.2v5l2.3%202.2v3.8l-2.3%202.2v3.4l4.7%203.8l4.7-3.8v-33C58.1%2025.4%2062%2020.2%2062%2014c0-7.7-6.3-14-14.1-14s-14%206.3-14%2014.1c0%206.1%203.9%2011.3%209.3%2013.2m9.4-17.9c0%202.6-2.1%204.6-4.6%204.6c-2.6%200-4.6-2.1-4.6-4.6c0-2.6%202.1-4.6%204.6-4.6s4.6%202.1%204.6%204.6%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/locked-with-key.svg?color=%231a73e8&size=48