pen icon
pen from Myna UI Icons by Praveen Juge · Regular · MIT Free for personal and commercial use.
- Name
- pen
- Set
- Myna UI Icons
- Style
- Regular
- Viewbox
- 24×24
- License
- MIT
1 other variant in Myna UI Icons
The same icon in other sets
penBootstrap IconspenBoxIcons v2penBoxIcons v2 SolidpenCarbonpenEmoji One (Colored)penFont Awesome 6 SolidpenFont Awesome Solidpen-outlineFlowbite Iconspen-16-filledFluent UI System IconspenFluent EmojipenFluent Emoji FlatpenFluent Emoji High Contrastpencss.ggpenJam IconspenLine AwesomepenLucidepenMage IconspenMaterial Design Iconspen-fillMingCute IconpenNoto EmojipenOpenMojipenPhosphorpen-boldSolarpenTDesign Icons
Use the pen icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m7.63 7.63l3.006 3.006M3.042 4.34l2.616 9.157c.778 2.723 2.933 4.6 5.764 4.6a5.6 5.6 0 0 0 1.264-.148c.392-.09.812-.001 1.097.283l2.46 2.46c.41.41 1.075.41 1.485 0l2.964-2.965a1.05 1.05 0 0 0 0-1.486l-2.455-2.455c-.284-.284-.373-.703-.284-1.094q.143-.624.145-1.27c0-2.832-1.877-4.987-4.6-5.765L4.341 3.042a1.05 1.05 0 0 0-1.3 1.299"/></svg>
React
import type { SVGProps } from "react";
export function MynauiPen(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="m7.63 7.63l3.006 3.006M3.042 4.34l2.616 9.157c.778 2.723 2.933 4.6 5.764 4.6a5.6 5.6 0 0 0 1.264-.148c.392-.09.812-.001 1.097.283l2.46 2.46c.41.41 1.075.41 1.485 0l2.964-2.965a1.05 1.05 0 0 0 0-1.486l-2.455-2.455c-.284-.284-.373-.703-.284-1.094q.143-.624.145-1.27c0-2.832-1.877-4.987-4.6-5.765L4.341 3.042a1.05 1.05 0 0 0-1.3 1.299"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m7.63 7.63l3.006 3.006M3.042 4.34l2.616 9.157c.778 2.723 2.933 4.6 5.764 4.6a5.6 5.6 0 0 0 1.264-.148c.392-.09.812-.001 1.097.283l2.46 2.46c.41.41 1.075.41 1.485 0l2.964-2.965a1.05 1.05 0 0 0 0-1.486l-2.455-2.455c-.284-.284-.373-.703-.284-1.094q.143-.624.145-1.27c0-2.832-1.877-4.987-4.6-5.765L4.341 3.042a1.05 1.05 0 0 0-1.3 1.299"/></svg> </template>
CSS
.icon-pen {
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%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m7.63%207.63l3.006%203.006M3.042%204.34l2.616%209.157c.778%202.723%202.933%204.6%205.764%204.6a5.6%205.6%200%200%200%201.264-.148c.392-.09.812-.001%201.097.283l2.46%202.46c.41.41%201.075.41%201.485%200l2.964-2.965a1.05%201.05%200%200%200%200-1.486l-2.455-2.455c-.284-.284-.373-.703-.284-1.094q.143-.624.145-1.27c0-2.832-1.877-4.987-4.6-5.765L4.341%203.042a1.05%201.05%200%200%200-1.3%201.299%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%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m7.63%207.63l3.006%203.006M3.042%204.34l2.616%209.157c.778%202.723%202.933%204.6%205.764%204.6a5.6%205.6%200%200%200%201.264-.148c.392-.09.812-.001%201.097.283l2.46%202.46c.41.41%201.075.41%201.485%200l2.964-2.965a1.05%201.05%200%200%200%200-1.486l-2.455-2.455c-.284-.284-.373-.703-.284-1.094q.143-.624.145-1.27c0-2.832-1.877-4.987-4.6-5.765L4.341%203.042a1.05%201.05%200%200%200-1.3%201.299%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mynaui/pen.svg?color=%231a73e8&size=48
