pen nib icon

pen-nib-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.

Name: pen-nib-light
Set: Phosphor
Style: Light
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

pen-nib pen-nib-bold pen-nib-duotone pen-nib-fill pen-nib-thin

The same icon in other sets

pen-nibFont Awesome 6 Solid pen-nibFont Awesome Solid pen-nib-outlineFlowbite Icons pen-nibLine Awesome pen-nib-fillRemix Icon

Related icons in Phosphor

pen-nib-straight

Use the pen nib icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 92.68a13.94 13.94 0 0 0-4.1-9.9L173.21 14.1a14 14 0 0 0-19.8 0l-28.73 28.73l-58.46 21.93a14 14 0 0 0-8.9 10.8L34.08 215a6 6 0 0 0 5.92 7a6.6 6.6 0 0 0 1-.08l139.44-23.24a14 14 0 0 0 10.81-8.9l21.92-58.46l28.74-28.74a13.92 13.92 0 0 0 4.09-9.9m-66 92.89a2 2 0 0 1-1.54 1.27L57.49 207l52.87-52.88a26 26 0 1 0-8.48-8.48L49 198.53l20.17-121A2 2 0 0 1 70.43 76l56.06-21L201 129.51ZM110 132a14 14 0 1 1 14 14a14 14 0 0 1-14-14m123.41-37.9L208 119.51L136.48 48l25.42-25.42a2 2 0 0 1 2.83 0l68.68 68.69a2 2 0 0 1 0 2.83"/></svg>

React

import type { SVGProps } from "react";

export function PhPenNibLight(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 92.68a13.94 13.94 0 0 0-4.1-9.9L173.21 14.1a14 14 0 0 0-19.8 0l-28.73 28.73l-58.46 21.93a14 14 0 0 0-8.9 10.8L34.08 215a6 6 0 0 0 5.92 7a6.6 6.6 0 0 0 1-.08l139.44-23.24a14 14 0 0 0 10.81-8.9l21.92-58.46l28.74-28.74a13.92 13.92 0 0 0 4.09-9.9m-66 92.89a2 2 0 0 1-1.54 1.27L57.49 207l52.87-52.88a26 26 0 1 0-8.48-8.48L49 198.53l20.17-121A2 2 0 0 1 70.43 76l56.06-21L201 129.51ZM110 132a14 14 0 1 1 14 14a14 14 0 0 1-14-14m123.41-37.9L208 119.51L136.48 48l25.42-25.42a2 2 0 0 1 2.83 0l68.68 68.69a2 2 0 0 1 0 2.83"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M246 92.68a13.94 13.94 0 0 0-4.1-9.9L173.21 14.1a14 14 0 0 0-19.8 0l-28.73 28.73l-58.46 21.93a14 14 0 0 0-8.9 10.8L34.08 215a6 6 0 0 0 5.92 7a6.6 6.6 0 0 0 1-.08l139.44-23.24a14 14 0 0 0 10.81-8.9l21.92-58.46l28.74-28.74a13.92 13.92 0 0 0 4.09-9.9m-66 92.89a2 2 0 0 1-1.54 1.27L57.49 207l52.87-52.88a26 26 0 1 0-8.48-8.48L49 198.53l20.17-121A2 2 0 0 1 70.43 76l56.06-21L201 129.51ZM110 132a14 14 0 1 1 14 14a14 14 0 0 1-14-14m123.41-37.9L208 119.51L136.48 48l25.42-25.42a2 2 0 0 1 2.83 0l68.68 68.69a2 2 0 0 1 0 2.83"/></svg>
</template>

CSS

.icon-pen-nib-light {
  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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M246%2092.68a13.94%2013.94%200%200%200-4.1-9.9L173.21%2014.1a14%2014%200%200%200-19.8%200l-28.73%2028.73l-58.46%2021.93a14%2014%200%200%200-8.9%2010.8L34.08%20215a6%206%200%200%200%205.92%207a6.6%206.6%200%200%200%201-.08l139.44-23.24a14%2014%200%200%200%2010.81-8.9l21.92-58.46l28.74-28.74a13.92%2013.92%200%200%200%204.09-9.9m-66%2092.89a2%202%200%200%201-1.54%201.27L57.49%20207l52.87-52.88a26%2026%200%201%200-8.48-8.48L49%20198.53l20.17-121A2%202%200%200%201%2070.43%2076l56.06-21L201%20129.51ZM110%20132a14%2014%200%201%201%2014%2014a14%2014%200%200%201-14-14m123.41-37.9L208%20119.51L136.48%2048l25.42-25.42a2%202%200%200%201%202.83%200l68.68%2068.69a2%202%200%200%201%200%202.83%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M246%2092.68a13.94%2013.94%200%200%200-4.1-9.9L173.21%2014.1a14%2014%200%200%200-19.8%200l-28.73%2028.73l-58.46%2021.93a14%2014%200%200%200-8.9%2010.8L34.08%20215a6%206%200%200%200%205.92%207a6.6%206.6%200%200%200%201-.08l139.44-23.24a14%2014%200%200%200%2010.81-8.9l21.92-58.46l28.74-28.74a13.92%2013.92%200%200%200%204.09-9.9m-66%2092.89a2%202%200%200%201-1.54%201.27L57.49%20207l52.87-52.88a26%2026%200%201%200-8.48-8.48L49%20198.53l20.17-121A2%202%200%200%201%2070.43%2076l56.06-21L201%20129.51ZM110%20132a14%2014%200%201%201%2014%2014a14%2014%200%200%201-14-14m123.41-37.9L208%20119.51L136.48%2048l25.42-25.42a2%202%200%200%201%202.83%200l68.68%2068.69a2%202%200%200%201%200%202.83%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/pen-nib-light.svg?color=%231a73e8&size=48