draw from Material Symbols Light by Google · Regular · Text · Apache-2.0 Free for personal and commercial use.

Name
draw
Set
Material Symbols Light
Style
Regular
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 draw icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 20v-2.5L18.214 4.292q.165-.165.348-.228T18.926 4q.189 0 .378.064q.19.063.33.228l1.073 1.074q.165.14.229.33q.063.189.063.377q0 .183-.063.366t-.23.348L7.5 20zM18.573 7.506L20 6.079L18.921 5l-1.427 1.427zM14.269 20q1.658 0 3.079-.79T18.769 17q0-.861-.58-1.53T16.5 14.362l-.764.764q.96.327 1.497.81T17.769 17q0 .844-1.037 1.422q-1.038.578-2.463.578q-.213 0-.357.143t-.143.357t.143.357t.357.143m-8.655-6.477l.73-.75q-.673-.296-1.008-.614Q5 11.84 5 11.5q0-.454.556-.889q.555-.434 2.102-1.098q1.969-.834 2.656-1.504Q11 7.341 11 6.5q0-1.086-.975-1.793T7.5 4q-.933 0-1.772.342q-.84.343-1.219.84q-.14.172-.119.37t.193.333q.17.12.36.1q.188-.021.328-.162q.408-.408.967-.615Q6.798 5 7.5 5q1.179 0 1.84.444Q10 5.89 10 6.5q0 .523-.553.945T7.262 8.592q-1.866.817-2.564 1.443T4 11.5q0 .608.416 1.113q.415.504 1.197.91"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightDraw(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="M5 20v-2.5L18.214 4.292q.165-.165.348-.228T18.926 4q.189 0 .378.064q.19.063.33.228l1.073 1.074q.165.14.229.33q.063.189.063.377q0 .183-.063.366t-.23.348L7.5 20zM18.573 7.506L20 6.079L18.921 5l-1.427 1.427zM14.269 20q1.658 0 3.079-.79T18.769 17q0-.861-.58-1.53T16.5 14.362l-.764.764q.96.327 1.497.81T17.769 17q0 .844-1.037 1.422q-1.038.578-2.463.578q-.213 0-.357.143t-.143.357t.143.357t.357.143m-8.655-6.477l.73-.75q-.673-.296-1.008-.614Q5 11.84 5 11.5q0-.454.556-.889q.555-.434 2.102-1.098q1.969-.834 2.656-1.504Q11 7.341 11 6.5q0-1.086-.975-1.793T7.5 4q-.933 0-1.772.342q-.84.343-1.219.84q-.14.172-.119.37t.193.333q.17.12.36.1q.188-.021.328-.162q.408-.408.967-.615Q6.798 5 7.5 5q1.179 0 1.84.444Q10 5.89 10 6.5q0 .523-.553.945T7.262 8.592q-1.866.817-2.564 1.443T4 11.5q0 .608.416 1.113q.415.504 1.197.91"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 20v-2.5L18.214 4.292q.165-.165.348-.228T18.926 4q.189 0 .378.064q.19.063.33.228l1.073 1.074q.165.14.229.33q.063.189.063.377q0 .183-.063.366t-.23.348L7.5 20zM18.573 7.506L20 6.079L18.921 5l-1.427 1.427zM14.269 20q1.658 0 3.079-.79T18.769 17q0-.861-.58-1.53T16.5 14.362l-.764.764q.96.327 1.497.81T17.769 17q0 .844-1.037 1.422q-1.038.578-2.463.578q-.213 0-.357.143t-.143.357t.143.357t.357.143m-8.655-6.477l.73-.75q-.673-.296-1.008-.614Q5 11.84 5 11.5q0-.454.556-.889q.555-.434 2.102-1.098q1.969-.834 2.656-1.504Q11 7.341 11 6.5q0-1.086-.975-1.793T7.5 4q-.933 0-1.772.342q-.84.343-1.219.84q-.14.172-.119.37t.193.333q.17.12.36.1q.188-.021.328-.162q.408-.408.967-.615Q6.798 5 7.5 5q1.179 0 1.84.444Q10 5.89 10 6.5q0 .523-.553.945T7.262 8.592q-1.866.817-2.564 1.443T4 11.5q0 .608.416 1.113q.415.504 1.197.91"/></svg>
</template>

CSS

.icon-draw {
  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%22M5%2020v-2.5L18.214%204.292q.165-.165.348-.228T18.926%204q.189%200%20.378.064q.19.063.33.228l1.073%201.074q.165.14.229.33q.063.189.063.377q0%20.183-.063.366t-.23.348L7.5%2020zM18.573%207.506L20%206.079L18.921%205l-1.427%201.427zM14.269%2020q1.658%200%203.079-.79T18.769%2017q0-.861-.58-1.53T16.5%2014.362l-.764.764q.96.327%201.497.81T17.769%2017q0%20.844-1.037%201.422q-1.038.578-2.463.578q-.213%200-.357.143t-.143.357t.143.357t.357.143m-8.655-6.477l.73-.75q-.673-.296-1.008-.614Q5%2011.84%205%2011.5q0-.454.556-.889q.555-.434%202.102-1.098q1.969-.834%202.656-1.504Q11%207.341%2011%206.5q0-1.086-.975-1.793T7.5%204q-.933%200-1.772.342q-.84.343-1.219.84q-.14.172-.119.37t.193.333q.17.12.36.1q.188-.021.328-.162q.408-.408.967-.615Q6.798%205%207.5%205q1.179%200%201.84.444Q10%205.89%2010%206.5q0%20.523-.553.945T7.262%208.592q-1.866.817-2.564%201.443T4%2011.5q0%20.608.416%201.113q.415.504%201.197.91%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%22M5%2020v-2.5L18.214%204.292q.165-.165.348-.228T18.926%204q.189%200%20.378.064q.19.063.33.228l1.073%201.074q.165.14.229.33q.063.189.063.377q0%20.183-.063.366t-.23.348L7.5%2020zM18.573%207.506L20%206.079L18.921%205l-1.427%201.427zM14.269%2020q1.658%200%203.079-.79T18.769%2017q0-.861-.58-1.53T16.5%2014.362l-.764.764q.96.327%201.497.81T17.769%2017q0%20.844-1.037%201.422q-1.038.578-2.463.578q-.213%200-.357.143t-.143.357t.143.357t.357.143m-8.655-6.477l.73-.75q-.673-.296-1.008-.614Q5%2011.84%205%2011.5q0-.454.556-.889q.555-.434%202.102-1.098q1.969-.834%202.656-1.504Q11%207.341%2011%206.5q0-1.086-.975-1.793T7.5%204q-.933%200-1.772.342q-.84.343-1.219.84q-.14.172-.119.37t.193.333q.17.12.36.1q.188-.021.328-.162q.408-.408.967-.615Q6.798%205%207.5%205q1.179%200%201.84.444Q10%205.89%2010%206.5q0%20.523-.553.945T7.262%208.592q-1.866.817-2.564%201.443T4%2011.5q0%20.608.416%201.113q.415.504%201.197.91%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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