spray can icon

spray-can from Line Awesome by Icons8 · Line · Design · Apache-2.0 Free for personal and commercial use.

Name: spray-can
Set: Line Awesome
Style: Line
Category: Design
Viewbox: 32×32
License: Apache 2.0
Aliases: spray-can-solid

The same icon in other sets

spray-canBoxIcons v2 spray-canBoxIcons v2 Solid spray-canFont Awesome 6 Solid spray-canFont Awesome Solid spray-can-16-filledFluent UI System Icons spray-canHuge Icons spray-canLucide spray-canPixelarticons

More design icons from Line Awesome

bezier-curve brush crop crop-alt drafting-compass fill fill-drip object-group object-group-solid object-ungroup object-ungroup-solid paint-roller pencil-ruler splotch swatchbook vector-square

Use the spray can icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M12 2v6h2v1.063C9.898 9.5 8.125 12.53 8.125 12.53L8 12.75V30h14V12.75l-.125-.219S20.102 9.5 16 9.062V8h2V2zm12 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1M14 4h2v2h-2zm7 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m3 2c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m-9 5c1.738 0 2.91.48 3.688 1h-7.375c.777-.52 1.949-1 3.687-1m-5 3h10v14H10zm5 4c-1.645 0-3 1.355-3 3s1.355 3 3 3s3-1.355 3-3s-1.355-3-3-3m0 2c.563 0 1 .438 1 1s-.438 1-1 1s-1-.438-1-1s.438-1 1-1"/></svg>

React

import type { SVGProps } from "react";

export function LaSprayCan(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M12 2v6h2v1.063C9.898 9.5 8.125 12.53 8.125 12.53L8 12.75V30h14V12.75l-.125-.219S20.102 9.5 16 9.062V8h2V2zm12 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1M14 4h2v2h-2zm7 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m3 2c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m-9 5c1.738 0 2.91.48 3.688 1h-7.375c.777-.52 1.949-1 3.687-1m-5 3h10v14H10zm5 4c-1.645 0-3 1.355-3 3s1.355 3 3 3s3-1.355 3-3s-1.355-3-3-3m0 2c.563 0 1 .438 1 1s-.438 1-1 1s-1-.438-1-1s.438-1 1-1"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M12 2v6h2v1.063C9.898 9.5 8.125 12.53 8.125 12.53L8 12.75V30h14V12.75l-.125-.219S20.102 9.5 16 9.062V8h2V2zm12 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1M14 4h2v2h-2zm7 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m3 2c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m-9 5c1.738 0 2.91.48 3.688 1h-7.375c.777-.52 1.949-1 3.687-1m-5 3h10v14H10zm5 4c-1.645 0-3 1.355-3 3s1.355 3 3 3s3-1.355 3-3s-1.355-3-3-3m0 2c.563 0 1 .438 1 1s-.438 1-1 1s-1-.438-1-1s.438-1 1-1"/></svg>
</template>

CSS

.icon-spray-can {
  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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202v6h2v1.063C9.898%209.5%208.125%2012.53%208.125%2012.53L8%2012.75V30h14V12.75l-.125-.219S20.102%209.5%2016%209.062V8h2V2zm12%200c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1M14%204h2v2h-2zm7%200c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1m3%202c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1m-9%205c1.738%200%202.91.48%203.688%201h-7.375c.777-.52%201.949-1%203.687-1m-5%203h10v14H10zm5%204c-1.645%200-3%201.355-3%203s1.355%203%203%203s3-1.355%203-3s-1.355-3-3-3m0%202c.563%200%201%20.438%201%201s-.438%201-1%201s-1-.438-1-1s.438-1%201-1%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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202v6h2v1.063C9.898%209.5%208.125%2012.53%208.125%2012.53L8%2012.75V30h14V12.75l-.125-.219S20.102%209.5%2016%209.062V8h2V2zm12%200c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1M14%204h2v2h-2zm7%200c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1m3%202c-.55%200-1%20.45-1%201s.45%201%201%201s1-.45%201-1s-.45-1-1-1m-9%205c1.738%200%202.91.48%203.688%201h-7.375c.777-.52%201.949-1%203.687-1m-5%203h10v14H10zm5%204c-1.645%200-3%201.355-3%203s1.355%203%203%203s3-1.355%203-3s-1.355-3-3-3m0%202c.563%200%201%20.438%201%201s-.438%201-1%201s-1-.438-1-1s.438-1%201-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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