WalletCard

stable

Digital wallet card with address, balance, network, and connection status

import { WalletCard } from "@danagraph/design-system/finance"

Wallet

ETHEthereum

125.42 ETH

0x742d...F1a8ACTIVE

Wallet

BTCBitcoin

2.85 BTC

bc1q.....x8m2FROZEN

Loading demo…

Props

Prop	Type	Default	Description
`address`req	`string`	—	Wallet address
`balance`req	`number`	—	Wallet balance
`asset`req	`string`	—	Asset symbol
`network`req	`string`	—	Blockchain network
`status`req	`WalletStatus`	—	Connection status
`label`	`string`	—	Card label

addressrequired

Type stringDefault —

Wallet address

balancerequired

Type numberDefault —

Wallet balance

assetrequired

Type stringDefault —

Asset symbol

networkrequired

Type stringDefault —

Blockchain network

statusrequired

Type WalletStatusDefault —

Connection status

label

Type stringDefault —

Card label

MobileStacks / Scroll

Wallet card goes full-width on mobile. Balance and action row stack vertically.

Design Rationale

This component was designed to express:

Stablecoin holdings table with peg deviation, reserves, and market cap metrics

Was this helpful?