<Name />
The Name component is used to display ENS or Basenames associated with Ethereum addresses.
Usage
Address with an ENS:
import { Name } from '@coinbase/onchainkit/identity';
const address = '0x02feeb0AdE57b6adEEdE5A4EEea6Cf8c21BeB6B1';
<Name address={address} /> Address with a Basename:
import { Name } from '@coinbase/onchainkit/identity';
import { base } from 'viem/chains';
const address = '0x02feeb0AdE57b6adEEdE5A4EEea6Cf8c21BeB6B1';
<Name address={address} chain={base} /> Override styles
You can override component styles using className.
import { Name } from '@coinbase/onchainkit/identity';
const address = '0x02feeb0AdE57b6adEEdE5A4EEea6Cf8c21BeB6B1';
<Name
address={address}
className="bg-emerald-400 px-2 py-1 rounded"
/>Add attestation badge
Show attestation on ENV name with Badge component.
Use OnchainKitProvider or Identity component with the schemaId prop.
import { Badge, Name, Identity } from '@coinbase/onchainkit/identity';
const address = '0x838aD0EAE54F99F1926dA7C3b6bFbF617389B4D9';
<Identity
address={address}
schemaId="0xf8b05c79f090979bf4a80270aba232dff11a10d9ca55c4f88de95317970f0de9"
>
<Name>
<Badge />
</Name>
</Identity>