Bucket foam

A duster and a foaming bucket.

File: bucket-foam.svg
Original name: Bucket Foam
viewBox: 0 0 1009.5 857.7
Weight: 4 KB

96px

160px

240px +

Use it

React

import { Illustration } from '@ba-icons/react';
import bucketFoam from '@ba-icons/illustrations/cleaning/bucket-foam';

<Illustration asset={bucketFoam} size={160} />

Vue

<script setup>
import { Illustration } from '@ba-icons/vue';
import bucketFoam from '@ba-icons/illustrations/cleaning/bucket-foam';
</script>

<template>
  <Illustration :asset="bucketFoam" :size="160" />
</template>

Astro

---
import { Illustration } from '@ba-icons/astro';
import bucketFoam from '@ba-icons/illustrations/cleaning/bucket-foam';
---

<Illustration asset={bucketFoam} size={160} />

HTML

<script src="https://icons.atmosphere.africa/cdn/ba-icons-0.4.0.js" defer></script>

<ba-illustration name="cleaning/bucket-foam" size="160"></ba-illustration>

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1009.5 857.7" fill="currentColor"><path d="M162.6 835.5Q154.6 832.5 146.1 824.5Q137.6 816.5 133.6 809.5L129.6 801.5V657.5V514.5L133.6 506.5Q135.6 502.5 140.1 497Q144.6 491.5 149.6 487.5Q154.6 483.5 157.6 482.5Q159.6 481.5 160.1 473.5Q160.6 465.5 160.6 421.5V360.5H143.6L126.6 359.5L105.6 323.5L83.6 288.5H61.6Q43.6 288.5 38.1 287Q32.6 285.5 26.6 279.5Q16.6 268.5 20.6 255Q24.6 241.5 39.6 237.5Q46.6 235.5 182.6 236Q318.6 236.5 324.6 238.5Q335.6 242.5 340.6 253.5Q344.6 261.5 341.6 270.5Q338.6 279.5 329.6 284.5Q322.6 288.5 300.6 288.5H278.6L256.6 323.5L235.6 359.5L218.6 360.5H201.6V420.5V481.5L209.6 486.5Q216.6 491.5 221.6 497.5Q229.6 508.5 230.6 527Q231.6 545.5 231.6 661.5L230.6 802.5L226.6 810.5Q216.6 828.5 198.6 834.5Q180.6 841.5 162.6 835.5ZM517.6 834.5Q486.6 824.5 471.6 796.5L465.6 785.5L445.6 614.5Q424.6 444.5 424.6 440.5V436.5H545.6H667.6L671.6 432.5Q682.6 423.5 672.6 413.5L668.6 409.5H541.6Q436.6 409.5 418.1 408.5Q399.6 407.5 391.6 400.5Q388.6 397.5 385.6 393Q382.6 388.5 380.6 383.5Q378.6 378.5 378.6 375.5Q378.6 365.5 385.1 355.5Q391.6 345.5 400.6 342.5Q404.6 341.5 405.6 339.5Q406.6 337.5 407.6 328.5Q413.6 264.5 443.6 205.5Q493.6 107.5 587.6 68Q681.6 28.5 776.6 65.5Q822.6 84.5 864.6 123.5Q899.6 157.5 921.6 197.5Q952.6 254.5 962.6 333.5Q963.6 341.5 966.6 342.5Q978.6 345.5 986.6 359.5Q993.6 374.5 986.6 388.5Q983.6 394.5 977.6 399.5Q971.6 404.5 964.6 407Q957.6 409.5 950.6 409.5Q948.6 409.5 948.6 409.5Q948.6 412.5 926.1 597Q903.6 781.5 902.6 784.5Q898.6 799.5 884.6 813.5Q870.6 827.5 853.6 833.5Q843.6 836.5 684.1 836.5Q524.6 836.5 517.6 834.5ZM912.6 332.5Q900.6 237.5 843.6 170.5Q824.6 147.5 796.6 129.5Q743.6 95.5 683.1 96Q622.6 96.5 569.6 131.5Q555.6 140.5 536.6 159Q517.6 177.5 507.6 191.5Q464.6 253.5 456.6 329.5L455.6 340.5H684.6H913.6ZM501.6 313.5Q495.6 309.5 494.1 296.5Q492.6 283.5 497.6 274.5Q502.6 263.5 514.1 255.5Q525.6 247.5 534.6 247.5Q539.6 247.5 544.6 236.5Q555.6 217.5 576.6 207.5Q585.6 203.5 603.6 203.5H622.6L628.6 193.5Q635.6 183.5 645.6 174.5Q672.6 150.5 708.6 148.5Q736.6 146.5 761.6 158.5Q778.6 166.5 794.6 184.5Q810.6 202.5 813.6 218.5Q814.6 223.5 824.6 227.5Q845.6 237.5 856.6 258.5Q862.6 271.5 862.6 288Q862.6 304.5 855.6 310.5Q843.6 321.5 833.6 310.5Q829.6 305.5 830.1 291Q830.6 276.5 827.6 271.5Q819.6 257.5 803.6 253.5Q796.6 251.5 792.6 249Q788.6 246.5 787.1 243Q785.6 239.5 783.6 232.5Q781.6 218.5 770.6 205Q759.6 191.5 745.6 185.5Q734.6 180.5 718.6 179.5Q694.6 178.5 675.6 190.5Q658.6 201.5 650.6 220.5Q644.6 235.5 639.6 238.5Q630.6 242.5 619.6 237.5Q600.6 228.5 583.6 239.5Q573.6 246.5 569.6 263.5Q567.6 277.5 557.6 278.5Q554.6 279.5 546.6 277.5Q536.6 276.5 530.6 282Q524.6 287.5 526.6 296.5Q528.6 308.5 518.6 313.5Q515.6 314.5 510.1 314.5Q504.6 314.5 501.6 313.5ZM33.6 215.5Q23.6 211.5 20.6 200.5Q17.6 189.5 23.6 180.5Q27.6 172.5 34.6 170Q41.6 167.5 57.6 166.5L76.6 165.5L62.6 158.5Q41.6 147.5 38.6 135.5Q34.6 121.5 46.6 110.5Q56.6 102.5 66.6 104Q76.6 105.5 104.6 121.5L109.6 124.5L107.6 120.5Q104.6 116.5 95.6 102Q86.6 87.5 86.6 79.5Q86.6 63.5 100.6 56.5Q114.6 49.5 127.6 57.5Q133.6 60.5 143.6 76.5L152.6 92.5L153.6 63.5Q154.6 40.5 156.6 34Q158.6 27.5 165.6 23.5Q178.6 16.5 190.6 21.5Q198.6 24.5 202.1 29Q205.6 33.5 207.1 42Q208.6 50.5 208.6 68.5V93.5L217.6 77.5Q226.6 62.5 232.6 58.5Q243.6 50.5 257.1 55Q270.6 59.5 274.6 73.5Q277.6 83.5 262.6 107.5Q252.6 122.5 252.6 123.5Q252.6 123.5 255.1 122.5Q257.6 121.5 261.6 119Q265.6 116.5 270.6 114.5Q288.6 104.5 297.6 104.5Q306.6 104.5 312.6 108.5Q324.6 117.5 323.6 131.5Q322.6 139.5 318.1 145Q313.6 150.5 299.6 157.5L285.6 165.5L304.6 166.5Q322.6 167.5 329.6 171Q336.6 174.5 341.6 184.5Q349.6 202.5 330.6 214.5L324.6 218.5H181.6Q38.6 218.5 33.6 215.5Z"></path></svg>

From the CDN

Link to the file instead of installing it: for <img>, CSS, emails and docs, with nothing added to your bundle. Served with CORS and cached for an hour.

https://icons.atmosphere.africa/svg/cleaning/bucket-foam.svg

<img src="https://icons.atmosphere.africa/svg/cleaning/bucket-foam.svg" alt="Bucket foam" width="160">

import { illustrationUrl } from '@ba-icons/illustrations';

illustrationUrl('cleaning/bucket-foam');
// → https://icons.atmosphere.africa/svg/cleaning/bucket-foam.svg

As an <img> it draws in black. To give it the text colour, use it as a mask:

.mark {
  background-color: currentColor;
  mask: url('https://icons.atmosphere.africa/svg/cleaning/bucket-foam.svg') center / contain no-repeat;
}

New to the packages? Point your project at the registry first.