paintbucket icon

paintbucket from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name: paintbucket
Set: IonIcons
Style: Regular
Viewbox: 512×512
License: MIT

The same icon in other sets

Use the paintbucket icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M128 64l39.667 72.102L16 288l197.604 192 163.328-160 58.33-12.307L160 32l-32 32zm197.131 224H104.857L215 177.863 325.131 288z" fill="currentColor"/><path d="M435.262 307.693s-60.734 66.179-60.732 99.207c0 33.028 27.192 59.803 60.731 59.801 33.548.002 60.74-26.772 60.739-59.801.001-33.028-60.738-99.207-60.738-99.207z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function IonPaintbucket(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M128 64l39.667 72.102L16 288l197.604 192 163.328-160 58.33-12.307L160 32l-32 32zm197.131 224H104.857L215 177.863 325.131 288z" fill="currentColor"/><path d="M435.262 307.693s-60.734 66.179-60.732 99.207c0 33.028 27.192 59.803 60.731 59.801 33.548.002 60.74-26.772 60.739-59.801.001-33.028-60.738-99.207-60.738-99.207z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M128 64l39.667 72.102L16 288l197.604 192 163.328-160 58.33-12.307L160 32l-32 32zm197.131 224H104.857L215 177.863 325.131 288z" fill="currentColor"/><path d="M435.262 307.693s-60.734 66.179-60.732 99.207c0 33.028 27.192 59.803 60.731 59.801 33.548.002 60.74-26.772 60.739-59.801.001-33.028-60.738-99.207-60.738-99.207z" fill="currentColor"/></svg>
</template>

CSS

.icon-paintbucket {
  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%20512%20512%22%3E%3Cpath%20d%3D%22M128%2064l39.667%2072.102L16%20288l197.604%20192%20163.328-160%2058.33-12.307L160%2032l-32%2032zm197.131%20224H104.857L215%20177.863%20325.131%20288z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M435.262%20307.693s-60.734%2066.179-60.732%2099.207c0%2033.028%2027.192%2059.803%2060.731%2059.801%2033.548.002%2060.74-26.772%2060.739-59.801.001-33.028-60.738-99.207-60.738-99.207z%22%20fill%3D%22currentColor%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%20512%20512%22%3E%3Cpath%20d%3D%22M128%2064l39.667%2072.102L16%20288l197.604%20192%20163.328-160%2058.33-12.307L160%2032l-32%2032zm197.131%20224H104.857L215%20177.863%20325.131%20288z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M435.262%20307.693s-60.734%2066.179-60.732%2099.207c0%2033.028%2027.192%2059.803%2060.731%2059.801%2033.548.002%2060.74-26.772%2060.739-59.801.001-33.028-60.738-99.207-60.738-99.207z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/paintbucket.svg?color=%231a73e8&size=48