locked emoji
locked from Emoji One (Colored) by Emoji One · Default · Objects · CC-BY-4.0 Attribution required.
- Name
- locked
- Set
- Emoji One (Colored)
- Style
- Default
- Category
- Objects
- Viewbox
- 64×64
- License
- CC BY 4.0
The same emoji in other sets
More objects icons from Emoji One (Colored)
Use the locked 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"/></svg>
React
import type { SVGProps } from "react";
export function EmojioneLocked(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"/></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"/></svg> </template>
CSS
.icon-locked {
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%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%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/locked.svg?color=%231a73e8&size=48
