Coins

two stacks of coins.

File: coins.svg
viewBox: 0 0 1008.8 1008.8
Weight: 1 KB

96px

160px

240px +

Use it

React

import { Illustration } from '@ba-icons/react';
import coins from '@ba-icons/illustrations/payments/coins';

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

Vue

<script setup>
import { Illustration } from '@ba-icons/vue';
import coins from '@ba-icons/illustrations/payments/coins';
</script>

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

Astro

---
import { Illustration } from '@ba-icons/astro';
import coins from '@ba-icons/illustrations/payments/coins';
---

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

HTML

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

<ba-illustration name="payments/coins" size="160"></ba-illustration>

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1008.8 1008.8" fill="currentColor"><path d="M19.4 787.4Q57.4 814.4 116.9 832.9Q176.4 851.4 243.4 859.9Q310.4 868.4 383.4 868.4Q495.4 868.4 592.9 847.9Q690.4 827.4 747.4 787.4V868.4Q747.4 901.4 698.4 929.4Q649.4 957.4 565.9 973.4Q482.4 989.4 383.4 989.4Q284.4 989.4 200.4 973.4Q116.4 957.4 67.9 929.4Q19.4 901.4 19.4 868.4ZM625.4 261.4Q551.4 261.4 484.4 251.9Q417.4 242.4 368.4 226.4Q319.4 210.4 290.4 187.9Q261.4 165.4 261.4 140.4Q261.4 107.4 310.4 79.4Q359.4 51.4 442.9 35.4Q526.4 19.4 625.4 19.4Q724.4 19.4 808.4 35.4Q892.4 51.4 940.9 79.4Q989.4 107.4 989.4 140.4Q989.4 173.4 940.9 201.4Q892.4 229.4 808.4 245.4Q724.4 261.4 625.4 261.4ZM19.4 588.4Q76.4 635.4 174.4 660.9Q272.4 686.4 382.9 686.4Q493.4 686.4 591.4 660.9Q689.4 635.4 747.4 588.4V686.4Q747.4 719.4 698.4 747.4Q649.4 775.4 565.9 791.4Q482.4 807.4 383.4 807.4Q284.4 807.4 200.4 791.4Q116.4 775.4 67.9 747.4Q19.4 719.4 19.4 686.4ZM807.4 609.4V488.4Q927.4 467.4 989.4 423.4V504.4Q989.4 537.4 939.9 565.4Q890.4 593.4 807.4 609.4ZM200.4 342.9Q284.4 322.4 383.4 322.4Q482.4 322.4 565.9 342.9Q649.4 363.4 698.4 397.9Q747.4 432.4 747.4 473.9Q747.4 515.4 698.4 550.4Q649.4 585.4 565.9 605.4Q482.4 625.4 383.4 625.4Q284.4 625.4 200.4 605.4Q116.4 585.4 67.9 550.4Q19.4 515.4 19.4 473.9Q19.4 432.4 67.9 397.9Q116.4 363.4 200.4 342.9ZM798.4 429.4Q774.4 364.4 685.4 320.4Q892.4 310.4 989.4 241.4V322.4Q989.4 356.4 937.4 384.9Q885.4 413.4 798.4 429.4Z"></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/payments/coins.svg

<img src="https://icons.atmosphere.africa/svg/payments/coins.svg" alt="Coins" width="160">

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

illustrationUrl('payments/coins');
// → https://icons.atmosphere.africa/svg/payments/coins.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/payments/coins.svg') center / contain no-repeat;
}

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