> ## Documentation Index
> Fetch the complete documentation index at: https://docs.streambird.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Overview

Easy user onboarding with MoonKey's customizable UI components.

MoonKey provides pre-built user interface components that handle wallet interactions. These components are designed to integrate seamlessly into your application while remaining highly customizable to match your brand.

<Tip>
  See live demos of all UI components and customization options at [demo.moonkey.fun](https://demo.moonkey.fun).
</Tip>

## Key Features

### Highly Customizable

Every UI component can be customized to match your brand:

* **Logo** - Display your company logo
* **Header Title** - Custom title for each screen
* **Header Description** - Custom description text
* **Close Button** - Show or hide the close button

### Wallet Operations

Handle all wallet interactions with pre-built UIs:

* **Sign Message** - For proving wallet ownership or signing in to third-party services
* **Sign Transaction** - For approving smart contract interactions
* **Send Transaction** - For transferring tokens or native currency
* **Export Key** - For users who want to use their wallet elsewhere

### Custom Branding

Maintain consistent branding across all screens:

```tsx theme={null}
<MoonKeyProvider
  publishableKey="your_publishable_key"
  config={{
    appearance: {
      logo: 'https://myapp.com/logo.png',
      loginHeaderTitle: 'MyApp',
      // These settings apply to all UI components
    }
  }}
>
  {children}
</MoonKeyProvider>
```

## Component Details

Explore detailed documentation for each UI component:

<CardGroup cols={2}>
  <Card title="Sign Message" icon="signature" href="/authentication/user-authentication/ui-components/sign-message">
    Message signing confirmation
  </Card>

  <Card title="Sign Transaction" icon="file-signature" href="/authentication/user-authentication/ui-components/sign-transaction">
    Transaction signing with details
  </Card>

  <Card title="Send Transaction" icon="paper-plane" href="/authentication/user-authentication/ui-components/send-transaction">
    Token and currency transfers
  </Card>

  <Card title="Export Key" icon="key" href="/authentication/user-authentication/ui-components/export-key">
    Private key export with warnings
  </Card>
</CardGroup>