pencil emoji
pencil from OpenMoji by OpenMoji · Default · Objects · CC-BY-SA-4.0 Attribution required.
- Name
- pencil
- Set
- OpenMoji
- Style
- Default
- Category
- Objects
- Viewbox
- 72×72
- License
- CC BY-SA 4.0
The same emoji in other sets
pencilAkar IconspencilBootstrap IconspencilBoxIcons v2pencilBoxIcons v2 SolidpencilEmoji One (Colored)pencilFramework7 IconspencilFont Awesome 6 SolidpencilFont Awesome SolidpencilFluent EmojipencilFluent Emoji FlatpencilFluent Emoji High ContrastpencilFirefox OS EmojipencilHeroIconspencilHuge IconspencilHumbleiconspencilIconParkpencilIconPark OutlinepencilIconPark SolidpencilIonIconspencilJam IconspencilMaterial Line IconspencilLucidepencilMajesticonspencilMaterial Design Icons
More objects icons from OpenMoji
Use the pencil emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 72 72"><path fill="#3f3f3f" d="m14.594 53.154l3.66 3.66l-5.63 2.279z"/><path fill="#f4aa41" d="m18.038 41.876l18.83-18.83l11.313 11.313l-18.67 18.67"/><path fill="#a57939" d="m14.413 52.566l3.515-9.171l9.9 9.899l-9.172 3.515"/><path fill="#ea5a47" d="m42.921 16.993l7.502-7.502l11.313 11.313l-7.439 7.438"/><path fill="#9b9b9a" d="m35.65 24.264l7.682-7.682l11.313 11.313l-7.617 7.617"/><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2"><path d="m18.63 56.82l9.198-3.526l25.993-25.993l-9.9-9.9l-25.993 25.994l-3.538 9.208zm28.705-42.833l3.504-3.503l9.899 9.899l-3.474 3.474m-38.708 18.91l9.9 9.899"/><path d="m14.398 52.582l-2.491 6.733l6.749-2.506M36.91 25.007l9.512 9.513"/></g></svg>
React
import type { SVGProps } from "react";
export function OpenmojiPencil(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 72 72"><path fill="#3f3f3f" d="m14.594 53.154l3.66 3.66l-5.63 2.279z"/><path fill="#f4aa41" d="m18.038 41.876l18.83-18.83l11.313 11.313l-18.67 18.67"/><path fill="#a57939" d="m14.413 52.566l3.515-9.171l9.9 9.899l-9.172 3.515"/><path fill="#ea5a47" d="m42.921 16.993l7.502-7.502l11.313 11.313l-7.439 7.438"/><path fill="#9b9b9a" d="m35.65 24.264l7.682-7.682l11.313 11.313l-7.617 7.617"/><g fill="none" stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeMiterlimit="10" strokeWidth="2"><path d="m18.63 56.82l9.198-3.526l25.993-25.993l-9.9-9.9l-25.993 25.994l-3.538 9.208zm28.705-42.833l3.504-3.503l9.899 9.899l-3.474 3.474m-38.708 18.91l9.9 9.899"/><path d="m14.398 52.582l-2.491 6.733l6.749-2.506M36.91 25.007l9.512 9.513"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 72 72"><path fill="#3f3f3f" d="m14.594 53.154l3.66 3.66l-5.63 2.279z"/><path fill="#f4aa41" d="m18.038 41.876l18.83-18.83l11.313 11.313l-18.67 18.67"/><path fill="#a57939" d="m14.413 52.566l3.515-9.171l9.9 9.899l-9.172 3.515"/><path fill="#ea5a47" d="m42.921 16.993l7.502-7.502l11.313 11.313l-7.439 7.438"/><path fill="#9b9b9a" d="m35.65 24.264l7.682-7.682l11.313 11.313l-7.617 7.617"/><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2"><path d="m18.63 56.82l9.198-3.526l25.993-25.993l-9.9-9.9l-25.993 25.994l-3.538 9.208zm28.705-42.833l3.504-3.503l9.899 9.899l-3.474 3.474m-38.708 18.91l9.9 9.899"/><path d="m14.398 52.582l-2.491 6.733l6.749-2.506M36.91 25.007l9.512 9.513"/></g></svg> </template>
CSS
.icon-pencil {
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%2072%2072%22%3E%3Cpath%20fill%3D%22%233f3f3f%22%20d%3D%22m14.594%2053.154l3.66%203.66l-5.63%202.279z%22%2F%3E%3Cpath%20fill%3D%22%23f4aa41%22%20d%3D%22m18.038%2041.876l18.83-18.83l11.313%2011.313l-18.67%2018.67%22%2F%3E%3Cpath%20fill%3D%22%23a57939%22%20d%3D%22m14.413%2052.566l3.515-9.171l9.9%209.899l-9.172%203.515%22%2F%3E%3Cpath%20fill%3D%22%23ea5a47%22%20d%3D%22m42.921%2016.993l7.502-7.502l11.313%2011.313l-7.439%207.438%22%2F%3E%3Cpath%20fill%3D%22%239b9b9a%22%20d%3D%22m35.65%2024.264l7.682-7.682l11.313%2011.313l-7.617%207.617%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%3E%3Cpath%20d%3D%22m18.63%2056.82l9.198-3.526l25.993-25.993l-9.9-9.9l-25.993%2025.994l-3.538%209.208zm28.705-42.833l3.504-3.503l9.899%209.899l-3.474%203.474m-38.708%2018.91l9.9%209.899%22%2F%3E%3Cpath%20d%3D%22m14.398%2052.582l-2.491%206.733l6.749-2.506M36.91%2025.007l9.512%209.513%22%2F%3E%3C%2Fg%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%2072%2072%22%3E%3Cpath%20fill%3D%22%233f3f3f%22%20d%3D%22m14.594%2053.154l3.66%203.66l-5.63%202.279z%22%2F%3E%3Cpath%20fill%3D%22%23f4aa41%22%20d%3D%22m18.038%2041.876l18.83-18.83l11.313%2011.313l-18.67%2018.67%22%2F%3E%3Cpath%20fill%3D%22%23a57939%22%20d%3D%22m14.413%2052.566l3.515-9.171l9.9%209.899l-9.172%203.515%22%2F%3E%3Cpath%20fill%3D%22%23ea5a47%22%20d%3D%22m42.921%2016.993l7.502-7.502l11.313%2011.313l-7.439%207.438%22%2F%3E%3Cpath%20fill%3D%22%239b9b9a%22%20d%3D%22m35.65%2024.264l7.682-7.682l11.313%2011.313l-7.617%207.617%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%3E%3Cpath%20d%3D%22m18.63%2056.82l9.198-3.526l25.993-25.993l-9.9-9.9l-25.993%2025.994l-3.538%209.208zm28.705-42.833l3.504-3.503l9.899%209.899l-3.474%203.474m-38.708%2018.91l9.9%209.899%22%2F%3E%3Cpath%20d%3D%22m14.398%2052.582l-2.491%206.733l6.749-2.506M36.91%2025.007l9.512%209.513%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/openmoji/pencil.svg?color=%231a73e8&size=48
