key emoji
key from Twitter Emoji by Twitter · Default · Objects · CC-BY-4.0 Attribution required.
- Name
- key
- Set
- Twitter Emoji
- Style
- Default
- Category
- Objects
- Viewbox
- 36×36
- License
- CC BY 4.0
The same emoji in other sets
keyAkar Iconskey-outlinedAnt Design IconskeyBootstrap IconskeyBoxIcons v2keyBoxIcons v2 SolidkeyCarbonkeyCatppuccin IconskeyCodiconskeyEmoji One (Colored)keyElement PluskeyFont Awesome 6 SolidkeyFont Awesome SolidkeyFeather Iconskey-16-filledFluent UI System IconskeyFluent EmojikeyFluent Emoji FlatkeyFluent Emoji High ContrastkeyFirefox OS Emojikeycss.ggkeyHeroIconskeyHumbleiconskeyIconParkkeyIconPark OutlinekeyIconPark Solid
More objects icons from Twitter Emoji
Use the key emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#c1694f" d="M32.614 3.414C28.31-.89 21.332-.89 17.027 3.414c-3.391 3.392-4.098 8.439-2.144 12.535l-3.916 3.915a2.44 2.44 0 0 0-.625 2.359l-1.973 1.972a1.22 1.22 0 0 0-1.731 0l-1.731 1.732a1.223 1.223 0 0 0 0 1.732l-.867.864a1.224 1.224 0 0 0-1.731 0l-.866.867a1.223 1.223 0 0 0 0 1.732c.015.016.036.02.051.033a3.062 3.062 0 0 0 4.711 3.863L20.08 21.144c4.097 1.955 9.144 1.247 12.535-2.146c4.302-4.302 4.302-11.28-.001-15.584m-1.731 5.195a2.45 2.45 0 0 1-3.464-3.464a2.45 2.45 0 0 1 3.464 3.464"/></svg>
React
import type { SVGProps } from "react";
export function TwemojiKey(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#c1694f" d="M32.614 3.414C28.31-.89 21.332-.89 17.027 3.414c-3.391 3.392-4.098 8.439-2.144 12.535l-3.916 3.915a2.44 2.44 0 0 0-.625 2.359l-1.973 1.972a1.22 1.22 0 0 0-1.731 0l-1.731 1.732a1.223 1.223 0 0 0 0 1.732l-.867.864a1.224 1.224 0 0 0-1.731 0l-.866.867a1.223 1.223 0 0 0 0 1.732c.015.016.036.02.051.033a3.062 3.062 0 0 0 4.711 3.863L20.08 21.144c4.097 1.955 9.144 1.247 12.535-2.146c4.302-4.302 4.302-11.28-.001-15.584m-1.731 5.195a2.45 2.45 0 0 1-3.464-3.464a2.45 2.45 0 0 1 3.464 3.464"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#c1694f" d="M32.614 3.414C28.31-.89 21.332-.89 17.027 3.414c-3.391 3.392-4.098 8.439-2.144 12.535l-3.916 3.915a2.44 2.44 0 0 0-.625 2.359l-1.973 1.972a1.22 1.22 0 0 0-1.731 0l-1.731 1.732a1.223 1.223 0 0 0 0 1.732l-.867.864a1.224 1.224 0 0 0-1.731 0l-.866.867a1.223 1.223 0 0 0 0 1.732c.015.016.036.02.051.033a3.062 3.062 0 0 0 4.711 3.863L20.08 21.144c4.097 1.955 9.144 1.247 12.535-2.146c4.302-4.302 4.302-11.28-.001-15.584m-1.731 5.195a2.45 2.45 0 0 1-3.464-3.464a2.45 2.45 0 0 1 3.464 3.464"/></svg> </template>
CSS
.icon-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%2036%2036%22%3E%3Cpath%20fill%3D%22%23c1694f%22%20d%3D%22M32.614%203.414C28.31-.89%2021.332-.89%2017.027%203.414c-3.391%203.392-4.098%208.439-2.144%2012.535l-3.916%203.915a2.44%202.44%200%200%200-.625%202.359l-1.973%201.972a1.22%201.22%200%200%200-1.731%200l-1.731%201.732a1.223%201.223%200%200%200%200%201.732l-.867.864a1.224%201.224%200%200%200-1.731%200l-.866.867a1.223%201.223%200%200%200%200%201.732c.015.016.036.02.051.033a3.062%203.062%200%200%200%204.711%203.863L20.08%2021.144c4.097%201.955%209.144%201.247%2012.535-2.146c4.302-4.302%204.302-11.28-.001-15.584m-1.731%205.195a2.45%202.45%200%200%201-3.464-3.464a2.45%202.45%200%200%201%203.464%203.464%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%2036%2036%22%3E%3Cpath%20fill%3D%22%23c1694f%22%20d%3D%22M32.614%203.414C28.31-.89%2021.332-.89%2017.027%203.414c-3.391%203.392-4.098%208.439-2.144%2012.535l-3.916%203.915a2.44%202.44%200%200%200-.625%202.359l-1.973%201.972a1.22%201.22%200%200%200-1.731%200l-1.731%201.732a1.223%201.223%200%200%200%200%201.732l-.867.864a1.224%201.224%200%200%200-1.731%200l-.866.867a1.223%201.223%200%200%200%200%201.732c.015.016.036.02.051.033a3.062%203.062%200%200%200%204.711%203.863L20.08%2021.144c4.097%201.955%209.144%201.247%2012.535-2.146c4.302-4.302%204.302-11.28-.001-15.584m-1.731%205.195a2.45%202.45%200%200%201-3.464-3.464a2.45%202.45%200%200%201%203.464%203.464%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/twemoji/key.svg?color=%231a73e8&size=48
