key emoji

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

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

The same emoji in other sets

keyAkar Iconskey-outlinedAnt Design IconskeyBootstrap IconskeyBoxIcons v2keyBoxIcons v2 SolidkeyCarbonkeyCatppuccin IconskeyCodiconskeyElement PluskeyFont Awesome 6 SolidkeyFont Awesome SolidkeyFeather Iconskey-16-filledFluent UI System IconskeyFluent EmojikeyFluent Emoji FlatkeyFluent Emoji High ContrastkeyFirefox OS Emojikeycss.ggkeyHeroIconskeyHumbleiconskeyIconParkkeyIconPark OutlinekeyIconPark SolidkeyIconPark TwoTone

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 key emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#eda454" d="M57 7C50.3.3 39.5.3 32.9 7c-5.5 5.5-6.4 13.8-3 20.3L5.5 52L2 60.4L3.6 62l6.3-.6l26.8-27.2c6.5 3.6 14.8 2.6 20.2-2.9c6.8-6.7 6.8-17.6.1-24.3m-4.8 12.2c-2 2-5.3 2-7.3 0s-2-5.3 0-7.4c2-2 5.3-2 7.3 0c2.1 2 2.1 5.3 0 7.4"/><path fill="#cc7f2b" d="m15.8 57.5l1.4-1.5v-2l-7.3 7.4l4.4-.5l1.5-1.5zM26.1 47l1.4-1.5v-2l-8.8 9h2l1.4-1.5h2l2-2zm4.4-15.4c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L7.9 52.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zm3 3c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L10.8 55.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zM56 8c-6.1-6.1-16-6.1-22.1 0c-4.6 4.6-5.7 11.4-3.4 17.1c-2.1-5.4-.9-11.7 3.4-16C39.7 3.2 49.2 3.2 55 9c5.8 5.9 5.8 15.4 0 21.2c-4.3 4.3-10.6 5.4-15.9 3.4c5.7 2.3 12.4 1.2 17-3.4c6-6.1 6-16.1-.1-22.2"/></svg>

React

import type { SVGProps } from "react";

export function EmojioneKey(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#eda454" d="M57 7C50.3.3 39.5.3 32.9 7c-5.5 5.5-6.4 13.8-3 20.3L5.5 52L2 60.4L3.6 62l6.3-.6l26.8-27.2c6.5 3.6 14.8 2.6 20.2-2.9c6.8-6.7 6.8-17.6.1-24.3m-4.8 12.2c-2 2-5.3 2-7.3 0s-2-5.3 0-7.4c2-2 5.3-2 7.3 0c2.1 2 2.1 5.3 0 7.4"/><path fill="#cc7f2b" d="m15.8 57.5l1.4-1.5v-2l-7.3 7.4l4.4-.5l1.5-1.5zM26.1 47l1.4-1.5v-2l-8.8 9h2l1.4-1.5h2l2-2zm4.4-15.4c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L7.9 52.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zm3 3c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L10.8 55.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zM56 8c-6.1-6.1-16-6.1-22.1 0c-4.6 4.6-5.7 11.4-3.4 17.1c-2.1-5.4-.9-11.7 3.4-16C39.7 3.2 49.2 3.2 55 9c5.8 5.9 5.8 15.4 0 21.2c-4.3 4.3-10.6 5.4-15.9 3.4c5.7 2.3 12.4 1.2 17-3.4c6-6.1 6-16.1-.1-22.2"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#eda454" d="M57 7C50.3.3 39.5.3 32.9 7c-5.5 5.5-6.4 13.8-3 20.3L5.5 52L2 60.4L3.6 62l6.3-.6l26.8-27.2c6.5 3.6 14.8 2.6 20.2-2.9c6.8-6.7 6.8-17.6.1-24.3m-4.8 12.2c-2 2-5.3 2-7.3 0s-2-5.3 0-7.4c2-2 5.3-2 7.3 0c2.1 2 2.1 5.3 0 7.4"/><path fill="#cc7f2b" d="m15.8 57.5l1.4-1.5v-2l-7.3 7.4l4.4-.5l1.5-1.5zM26.1 47l1.4-1.5v-2l-8.8 9h2l1.4-1.5h2l2-2zm4.4-15.4c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L7.9 52.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zm3 3c.5-.5.2-.7 0-1c-.3-.3-.4-.6-.9 0L10.8 55.5c-.5.5-.2.7 0 1c.3.3.4.6.9 0zM56 8c-6.1-6.1-16-6.1-22.1 0c-4.6 4.6-5.7 11.4-3.4 17.1c-2.1-5.4-.9-11.7 3.4-16C39.7 3.2 49.2 3.2 55 9c5.8 5.9 5.8 15.4 0 21.2c-4.3 4.3-10.6 5.4-15.9 3.4c5.7 2.3 12.4 1.2 17-3.4c6-6.1 6-16.1-.1-22.2"/></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%2064%2064%22%3E%3Cpath%20fill%3D%22%23eda454%22%20d%3D%22M57%207C50.3.3%2039.5.3%2032.9%207c-5.5%205.5-6.4%2013.8-3%2020.3L5.5%2052L2%2060.4L3.6%2062l6.3-.6l26.8-27.2c6.5%203.6%2014.8%202.6%2020.2-2.9c6.8-6.7%206.8-17.6.1-24.3m-4.8%2012.2c-2%202-5.3%202-7.3%200s-2-5.3%200-7.4c2-2%205.3-2%207.3%200c2.1%202%202.1%205.3%200%207.4%22%2F%3E%3Cpath%20fill%3D%22%23cc7f2b%22%20d%3D%22m15.8%2057.5l1.4-1.5v-2l-7.3%207.4l4.4-.5l1.5-1.5zM26.1%2047l1.4-1.5v-2l-8.8%209h2l1.4-1.5h2l2-2zm4.4-15.4c.5-.5.2-.7%200-1c-.3-.3-.4-.6-.9%200L7.9%2052.5c-.5.5-.2.7%200%201c.3.3.4.6.9%200zm3%203c.5-.5.2-.7%200-1c-.3-.3-.4-.6-.9%200L10.8%2055.5c-.5.5-.2.7%200%201c.3.3.4.6.9%200zM56%208c-6.1-6.1-16-6.1-22.1%200c-4.6%204.6-5.7%2011.4-3.4%2017.1c-2.1-5.4-.9-11.7%203.4-16C39.7%203.2%2049.2%203.2%2055%209c5.8%205.9%205.8%2015.4%200%2021.2c-4.3%204.3-10.6%205.4-15.9%203.4c5.7%202.3%2012.4%201.2%2017-3.4c6-6.1%206-16.1-.1-22.2%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%23eda454%22%20d%3D%22M57%207C50.3.3%2039.5.3%2032.9%207c-5.5%205.5-6.4%2013.8-3%2020.3L5.5%2052L2%2060.4L3.6%2062l6.3-.6l26.8-27.2c6.5%203.6%2014.8%202.6%2020.2-2.9c6.8-6.7%206.8-17.6.1-24.3m-4.8%2012.2c-2%202-5.3%202-7.3%200s-2-5.3%200-7.4c2-2%205.3-2%207.3%200c2.1%202%202.1%205.3%200%207.4%22%2F%3E%3Cpath%20fill%3D%22%23cc7f2b%22%20d%3D%22m15.8%2057.5l1.4-1.5v-2l-7.3%207.4l4.4-.5l1.5-1.5zM26.1%2047l1.4-1.5v-2l-8.8%209h2l1.4-1.5h2l2-2zm4.4-15.4c.5-.5.2-.7%200-1c-.3-.3-.4-.6-.9%200L7.9%2052.5c-.5.5-.2.7%200%201c.3.3.4.6.9%200zm3%203c.5-.5.2-.7%200-1c-.3-.3-.4-.6-.9%200L10.8%2055.5c-.5.5-.2.7%200%201c.3.3.4.6.9%200zM56%208c-6.1-6.1-16-6.1-22.1%200c-4.6%204.6-5.7%2011.4-3.4%2017.1c-2.1-5.4-.9-11.7%203.4-16C39.7%203.2%2049.2%203.2%2055%209c5.8%205.9%205.8%2015.4%200%2021.2c-4.3%204.3-10.6%205.4-15.9%203.4c5.7%202.3%2012.4%201.2%2017-3.4c6-6.1%206-16.1-.1-22.2%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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