Components

AppKit’s web components are custom and reusable HTML tags. They will work across modern browsers, and can be used with any JavaScript library or framework that works with HTML.

Web components are global html elements that don’t require importing.

List of optional properties for AppKit web components

<appkit-button />

Variable	Description	Type
disabled	Enable or disable the button.	boolean
balance	Show or hide the user’s balance.	'show' | 'hide'
size	Default size for the button.	'md' | 'sm'
label	The text shown in the button.	string
loadingLabel	The text shown in the button when the modal is open.	string
namespace	Option to show specific namespace account info. Note: eip155 is for EVM and bip122 is for Bitcoin.	'eip155' | 'solana' | 'bip122'

<appkit-account-button />

Variable	Description	Type
disabled	Enable or disable the button.	boolean
balance	Show or hide the user’s balance.	'show' | 'hide'

<appkit-connect-button />

Variable	Description	Type
size	Default size for the button.	'md' | 'sm'
label	The text shown in the button.	string
loadingLabel	The text shown in the button when the modal is open.	string

<appkit-network-button />

Variable	Description	Type
disabled	Enable or disable the button.	boolean

When using AppKit components in Nuxt, make sure to wrap them in <client-only> tags for SSR compatibility.

<template>
  <client-only>
    <appkit-button />
    <appkit-network-button />
    <appkit-connect-button />
    <appkit-account-button />
  </client-only>
</template>