Backpack assets

The backpack assets package includes all our Icons, Flags, Logos, and Academicons as separately installable packages.

Icons

To install the icons package, first add it as a dependency:

 yarn add @ef-global/backpack-icons

Now to use an icon, import it directly in your component e.g:

import {Accommodation, Airplane} from "@ef-global/backpack-icons";
<Accommodation />
<Airplane />

You can see a full list of the included icons in the Icon docs.

To install the logos package, same deal:

 yarn add @ef-global/backpack-logos

To use a logo, import it directly in your component e.g:

import {EfLogo} from "@ef-global/backpack-logos";
<EfLogo />

You can see a full list of the included logos in the Logo docs.

To install the flags package:

yarn add @ef-global/backpack-flags

Flags come in 3 aspect ratios, 1:1, 2:1, and 3:2. We have named the components including the aspect ratio, so to use the UK flag in 3:2 you can:

import { FlagGb32 } from "@ef-global/backpack-flags";
<FlagGb32 />

You can find all the flags in the Flags 1:1, Flags 2:1, and Flags 3:2 docs.

Our animated Academicons come as lottie json files, so you will need a Lottie player to display them. We provide one in the Backpack UI lib.