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

# Components

> React components for React SDK reference for Crossmint wallets

## ExportPrivateKeyButton

### Props

<ResponseField name="appearance" type="UIConfig">
  Optional appearance configuration for styling the export button.

  <Expandable title="properties">
    <ResponseField name="borderRadius" type="string" />

    <ResponseField name="colors" type="UiConfigColors">
      <Expandable title="properties">
        <ResponseField name="accent" type="string" />

        <ResponseField name="background" type="string" />

        <ResponseField name="backgroundSecondary" type="string" />

        <ResponseField name="backgroundTertiary" type="string" />

        <ResponseField name="border" type="string" />

        <ResponseField name="buttonBackground" type="string" />

        <ResponseField name="danger" type="string" />

        <ResponseField name="inputBackground" type="string" />

        <ResponseField name="textLink" type="string" />

        <ResponseField name="textPrimary" type="string" />

        <ResponseField name="textSecondary" type="string" />
      </Expandable>
    </ResponseField>

    <ResponseField name="fonts" type="UiConfigFonts">
      <Expandable title="properties">
        <ResponseField name="cssSrc" type="string" />

        <ResponseField name="family" type="string" required />

        <ResponseField name="display" type="string" />

        <ResponseField name="src" type="string" />

        <ResponseField name="style" type="&#x22;normal&#x22; | &#x22;italic&#x22; | &#x22;oblique&#x22;" />

        <ResponseField name="weight" type="string" />
      </Expandable>
    </ResponseField>

    <ResponseField name="fontSizeBase" type="string" />

    <ResponseField name="fontWeightPrimary" type="string" />

    <ResponseField name="fontWeightSecondary" type="string" />

    <ResponseField name="hideCardForm" type="boolean" />

    <ResponseField name="spacingUnit" type="string" />
  </Expandable>
</ResponseField>

<ResponseField name="onExport" type="() => void | Promise<void>">
  Optional callback invoked after the user successfully exports (copies) their private key.
</ResponseField>

### Usage

```tsx theme={null}
import { ExportPrivateKeyButton } from "@crossmint/client-sdk-react-ui";

function WalletSettings() {
    return (
        <div>
            <h3>Export Private Key</h3>
            <ExportPrivateKeyButton
                appearance={{
                    colors: { border: "#e2e8f0" },
                    borderRadius: "12px",
                }}
            />
        </div>
    );
}
```

> **Note:** Only works with email and phone signers. Will not render for passkey or external wallet signers.