pnpm add @api3/logos
npm i @api3/logos
yarn add @api3/logosimport { ChainLogo, SymbolLogo, ApiProviderLogo } from '@api3/logos';
<div>
<img src={ChainLogo('43114')} width={50} height={50} alt="43114" />
<img src={SymbolLogo('BTC')} width={50} height={50} alt="BTC" />
<img src={ApiProviderLogo('nodary')} width={50} height={50} alt="nodary" />
</div>;<template>
<div>
<img src={ChainLogo('43114')} width={50} height={50} alt='43114' />
<img src={SymbolLogo('BTC')} width={50} height={50} alt='BTC' />
<img src={ApiProviderLogo('nodary')} width={50} height={50} alt='nodary' />
</div>
</template>
<script>
import { ChainLogo, SymbolLogo, ApiProviderLogo } from '@api3/logos';
export default {
...
methods: {
getSymbolLogo(symbol) {
return SymbolLogo(symbol);
},
getChainLogo(chainId) {
return ChainLogo(chainId);
},
getApiProviderLogo(apiProvider) {
return ApiProviderLogo(apiProvider);
},
}
...
}
</script>light prop is optional and defaults to false (dark theme). light = true will return the light theme logo.
| Prop | Type | Description |
|---|---|---|
| id | string | Chain id |
| light | boolean | Light theme |
| Prop | Type | Description |
|---|---|---|
| id | string | Symbol id |
| light | boolean | Light theme |
| Prop | Type | Description |
|---|---|---|
| id | string | ApiProvider |
| light | boolean | Light theme |
Live demo at https://api3dao.github.io/logos