ink-pen-rounded from Material Symbols Light by Google · Rounded · Text · Apache-2.0 Free for personal and commercial use.

Name
ink-pen-rounded
Set
Material Symbols Light
Style
Rounded
Category
Text
Viewbox
24×24
License
Apache 2.0

5 other variants in Material Symbols Light

The same icon in other sets

More text icons from Material Symbols Light

Use the ink pen icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m13.948 12.533l-2.327-2.352l4.083-4.077l-.36-.36q-.154-.154-.461-.154t-.462.154L9.877 10.29q-.146.146-.335.146t-.334-.146q-.166-.147-.166-.348t.147-.347l4.557-4.557q.485-.485 1.153-.485t1.153.485l.36.36l.827-.828q.242-.242.568-.242t.568.242l1.267 1.268q.243.242.224.53q-.02.287-.262.53zM4.942 20q-.348 0-.577-.23q-.23-.23-.23-.578v-1.098q0-.207.073-.387t.233-.34l6.448-6.453l2.352 2.327l-6.474 6.453q-.16.16-.339.233T6.041 20z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightInkPenRounded(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m13.948 12.533l-2.327-2.352l4.083-4.077l-.36-.36q-.154-.154-.461-.154t-.462.154L9.877 10.29q-.146.146-.335.146t-.334-.146q-.166-.147-.166-.348t.147-.347l4.557-4.557q.485-.485 1.153-.485t1.153.485l.36.36l.827-.828q.242-.242.568-.242t.568.242l1.267 1.268q.243.242.224.53q-.02.287-.262.53zM4.942 20q-.348 0-.577-.23q-.23-.23-.23-.578v-1.098q0-.207.073-.387t.233-.34l6.448-6.453l2.352 2.327l-6.474 6.453q-.16.16-.339.233T6.041 20z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m13.948 12.533l-2.327-2.352l4.083-4.077l-.36-.36q-.154-.154-.461-.154t-.462.154L9.877 10.29q-.146.146-.335.146t-.334-.146q-.166-.147-.166-.348t.147-.347l4.557-4.557q.485-.485 1.153-.485t1.153.485l.36.36l.827-.828q.242-.242.568-.242t.568.242l1.267 1.268q.243.242.224.53q-.02.287-.262.53zM4.942 20q-.348 0-.577-.23q-.23-.23-.23-.578v-1.098q0-.207.073-.387t.233-.34l6.448-6.453l2.352 2.327l-6.474 6.453q-.16.16-.339.233T6.041 20z"/></svg>
</template>

CSS

.icon-ink-pen-rounded {
  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%22currentColor%22%20d%3D%22m13.948%2012.533l-2.327-2.352l4.083-4.077l-.36-.36q-.154-.154-.461-.154t-.462.154L9.877%2010.29q-.146.146-.335.146t-.334-.146q-.166-.147-.166-.348t.147-.347l4.557-4.557q.485-.485%201.153-.485t1.153.485l.36.36l.827-.828q.242-.242.568-.242t.568.242l1.267%201.268q.243.242.224.53q-.02.287-.262.53zM4.942%2020q-.348%200-.577-.23q-.23-.23-.23-.578v-1.098q0-.207.073-.387t.233-.34l6.448-6.453l2.352%202.327l-6.474%206.453q-.16.16-.339.233T6.041%2020z%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%22currentColor%22%20d%3D%22m13.948%2012.533l-2.327-2.352l4.083-4.077l-.36-.36q-.154-.154-.461-.154t-.462.154L9.877%2010.29q-.146.146-.335.146t-.334-.146q-.166-.147-.166-.348t.147-.347l4.557-4.557q.485-.485%201.153-.485t1.153.485l.36.36l.827-.828q.242-.242.568-.242t.568.242l1.267%201.268q.243.242.224.53q-.02.287-.262.53zM4.942%2020q-.348%200-.577-.23q-.23-.23-.23-.578v-1.098q0-.207.073-.387t.233-.34l6.448-6.453l2.352%202.327l-6.474%206.453q-.16.16-.339.233T6.041%2020z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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