square pen icon

square-pen-sharp-fill from Keyline Icons by Keyline Icons · Sharp Fill · MIT Free for personal and commercial use.

Name
square-pen-sharp-fill
Set
Keyline Icons
Style
Sharp Fill
Viewbox
24×24
License
MIT

7 other variants in Keyline Icons

square-pensquare-pen-duotonesquare-pen-fillsquare-pen-sharpsquare-pen-sharp-duotonesquare-pen-sharp-two-tonesquare-pen-two-tone

The same icon in other sets

square-penFont Awesome 6 Solidsquare-penFont Awesome Solidsquare-penHuge Iconssquare-penLucide

Related icons in Keyline Icons

square-activitysquare-alertsquare-align-offset-bottomsquare-align-offset-leftsquare-align-offset-rightsquare-align-offset-topsquare-arrow-downsquare-arrow-down-leftsquare-arrow-down-rightsquare-arrow-leftsquare-arrow-rightsquare-arrow-u-turn-leftsquare-arrow-u-turn-rightsquare-arrow-upsquare-arrow-up-leftsquare-arrow-up-rightsquare-bar-chartsquare-bar-chart-2square-bar-chart-2-downsquare-bar-chart-2-horizontal-endsquare-bar-chart-2-horizontal-startsquare-bar-chart-downsquare-bar-chart-horizontal-endsquare-bar-chart-horizontal-start

Use the square pen icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" d="M10.8714 14.4285L14.9962 12.7786C15.1219 12.7283 15.2361 12.653 15.3319 12.5572L21.1945 6.6945C22.1709 5.7183 22.1709 3.7817 21.1945 2.8054C20.2183 1.8291 18.2817 1.8291 17.3054 2.8055L11.4428 8.6681C11.347 8.7639 11.2717 8.8781 11.2214 9.0038L9.5715 13.1286C9.245 13.9449 10.0551 14.755 10.8714 14.4285Z" stroke="none"/><path d="M13 3L3 3L3 21L21 21L21 11"/></g></svg>

React

import type { SVGProps } from "react";

export function KeylineIconsSquarePenSharpFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinejoin="round" strokeWidth="2"><path fill="currentColor" d="M10.8714 14.4285L14.9962 12.7786C15.1219 12.7283 15.2361 12.653 15.3319 12.5572L21.1945 6.6945C22.1709 5.7183 22.1709 3.7817 21.1945 2.8054C20.2183 1.8291 18.2817 1.8291 17.3054 2.8055L11.4428 8.6681C11.347 8.7639 11.2717 8.8781 11.2214 9.0038L9.5715 13.1286C9.245 13.9449 10.0551 14.755 10.8714 14.4285Z" stroke="none"/><path d="M13 3L3 3L3 21L21 21L21 11"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" d="M10.8714 14.4285L14.9962 12.7786C15.1219 12.7283 15.2361 12.653 15.3319 12.5572L21.1945 6.6945C22.1709 5.7183 22.1709 3.7817 21.1945 2.8054C20.2183 1.8291 18.2817 1.8291 17.3054 2.8055L11.4428 8.6681C11.347 8.7639 11.2717 8.8781 11.2214 9.0038L9.5715 13.1286C9.245 13.9449 10.0551 14.755 10.8714 14.4285Z" stroke="none"/><path d="M13 3L3 3L3 21L21 21L21 11"/></g></svg>
</template>

CSS

.icon-square-pen-sharp-fill {
  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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M10.8714%2014.4285L14.9962%2012.7786C15.1219%2012.7283%2015.2361%2012.653%2015.3319%2012.5572L21.1945%206.6945C22.1709%205.7183%2022.1709%203.7817%2021.1945%202.8054C20.2183%201.8291%2018.2817%201.8291%2017.3054%202.8055L11.4428%208.6681C11.347%208.7639%2011.2717%208.8781%2011.2214%209.0038L9.5715%2013.1286C9.245%2013.9449%2010.0551%2014.755%2010.8714%2014.4285Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M13%203L3%203L3%2021L21%2021L21%2011%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M10.8714%2014.4285L14.9962%2012.7786C15.1219%2012.7283%2015.2361%2012.653%2015.3319%2012.5572L21.1945%206.6945C22.1709%205.7183%2022.1709%203.7817%2021.1945%202.8054C20.2183%201.8291%2018.2817%201.8291%2017.3054%202.8055L11.4428%208.6681C11.347%208.7639%2011.2717%208.8781%2011.2214%209.0038L9.5715%2013.1286C9.245%2013.9449%2010.0551%2014.755%2010.8714%2014.4285Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M13%203L3%203L3%2021L21%2021L21%2011%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/square-pen-sharp-fill.svg?color=%231a73e8&size=48