Identity components & utilities
Identity
is a React context provider and arranges identity components.
import { Avatar, Identity, Name, Badge, Address } from '@coinbase/onchainkit/identity';
<Identity
address="0x838aD0EAE54F99F1926dA7C3b6bFbF617389B4D9"
schemaId="0xf8b05c79f090979bf4a80270aba232dff11a10d9ca55c4f88de95317970f0de9"
>
<Avatar />
<Name>
<Badge />
</Name>
<Address />
</Identity>
import { Avatar, Identity, Name, Badge, Address } from '@coinbase/onchainkit/identity';
<Identity
address="0x838aD0EAE54F99F1926dA7C3b6bFbF617389B4D9"
schemaId="0xf8b05c79f090979bf4a80270aba232dff11a10d9ca55c4f88de95317970f0de9"
>
<Avatar />
<Name>
<Badge
tooltip={true}
/>
</Name>
<Address />
</Identity>
// @errors: 2304 2552
import { Avatar, Identity, Name, Badge, Address } from '@coinbase/onchainkit/identity';
<Identity
address="0x838aD0EAE54F99F1926dA7C3b6bFbF617389B4D9"
schemaId="0xf8b05c79f090979bf4a80270aba232dff11a10d9ca55c4f88de95317970f0de9"
>
<Avatar />
<Name>
<Badge
tooltip="Coinbase Verified Account"
/>
</Name>
<Address />
</Identity>
className
prop.
// @errors: 2304 2552 2657
import { Avatar, Identity, Name, Badge, Address } from '@coinbase/onchainkit/identity';
<Identity
address="0x838aD0EAE54F99F1926dA7C3b6bFbF617389B4D9"
schemaId="0xf8b05c79f090979bf4a80270aba232dff11a10d9ca55c4f88de95317970f0de9"
>
<Avatar>
<Badge
className="bg-error"
/>
</Avatar>
<Name
className="text-orange-600"
/>
<Address
className="text-zinc-500 font-bold"
/>
</Identity>
import { Avatar, Identity, Name, Badge, Address } from '@coinbase/onchainkit/identity';
// ---cut-start---
<div>
// ---cut-end---
<Identity address="0x838..." schemaId="0xf8b...">
<Avatar />
<Name>
<Badge />
</Name>
</Identity>
<Identity address="0x838..." schemaId="0xf8b...">
<Name>
<Badge />
</Name>
<Address />
</Identity>
// ---cut-after---
</div>
Was this page helpful?