Distribution route

A signpost with signs pointing both ways.

File: distribution-route.svg
Original name: Distribution C
viewBox: 0 0 983.1 982.8
Weight: 1 KB

96px

160px

240px +

Use it

React

import { Illustration } from '@ba-icons/react';
import distributionRoute from '@ba-icons/illustrations/distribution/distribution-route';

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

Vue

<script setup>
import { Illustration } from '@ba-icons/vue';
import distributionRoute from '@ba-icons/illustrations/distribution/distribution-route';
</script>

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

Astro

---
import { Illustration } from '@ba-icons/astro';
import distributionRoute from '@ba-icons/illustrations/distribution/distribution-route';
---

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

HTML

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

<ba-illustration name="distribution/distribution-route" size="160"></ba-illustration>

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 983.1 982.8" fill="currentColor"><path d="M497.5 502.9Q497.5 473.9 497.5 420.9Q497.5 124.9 499.5 75.4Q501.5 25.9 512.5 21.9Q514.5 21.9 515.5 20.9Q529.5 15.9 542 23.4Q554.5 30.9 554.5 44.9Q555.5 54.9 554.5 508.9L553.5 963.9H525.5H497.5ZM191.5 544.9Q161.5 511.9 161.5 507.4Q161.5 502.9 191.5 469.9L220.5 436.9H329.5H439.5L438.5 506.9L437.5 575.9L329.5 576.9L220.5 577.9ZM616.5 372.9 617.5 304.9H757.5Q855.5 303.9 878 304.4Q900.5 304.9 904.5 308.9Q910.5 313.9 938.5 344.9Q966.5 375.9 964 379.4Q961.5 382.9 932.5 415.9L902.5 447.9H760.5Q618.5 447.9 617 444.4Q615.5 440.9 616.5 372.9ZM49.5 285.9Q17.5 250.9 19 247.4Q20.5 243.9 50.5 209.9L80.5 176.9L259.5 177.9H437.5V248.9V319.9L259.5 320.9H80.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/distribution/distribution-route.svg

<img src="https://icons.atmosphere.africa/svg/distribution/distribution-route.svg" alt="Distribution route" width="160">

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

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

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