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

# Show the Orchard investment flow with your own branding

> Load the Orchard SDK from the CDN and pass a branding object with your name and primary color so the investment flow matches your product.

Custom branding lets partners show the Orchard investment flow under their own name and color. It uses the same CDN script as the [CDN Script](/integration/cdn-script) method, plus a `branding` option. The example below uses a partner called Crowdital.

<Steps>
  <Step title="Load the SDK">
    ```javascript theme={null}
    <script src="https://sdk.orchard.africa/orchard.js"></script>
    ```
  </Step>

  <Step title="Add a button">
    ```javascript theme={null}
    <button id="invest">Invest</button>
    ```
  </Step>

  <Step title="Create a branded instance and open the flow">
    ```javascript index.html theme={null}
    <script>
      const crowdital = new Crowdital({
        publicKey: 'pk_live_xxxxxxxxx',
        apiUrl: 'https://core.orchard.africa/api/v1/embed',
        sessionToken: 'your-session-token',
        apiKey: 'your-api-key',
        branding: {
          primaryColor: '#0f2638',
        },
      })

      document
        .getElementById('invest')
        .addEventListener('click', () => {
          crowdital.open({
            onSuccess: function (investment) {
              console.log('Investment successful', investment)
            },
            onClose: function () {
              console.log('Crowdital closed')
            },
            onError: function (error) {
              console.error('Investment failed', error)
            },
          })
        })
    </script>
    ```

    <Note>
      Replace`your-session-token` with a token from `POST {apiUrl}/session`. See [Authentication](/authentication).
    </Note>
  </Step>
</Steps>

## Configuration

<ParamField path="publicKey" type="string" required>
  Your Orchard public key, starting with `pk_`.
</ParamField>

<ParamField path="apiUrl" type="string" required>
  The Orchard API URL.
</ParamField>

<ParamField path="sessionToken" type="string" required>
  A session token for the current user.
</ParamField>

<ParamField path="apiKey" type="string" required>
  Your Orchard API key.
</ParamField>

<ParamField path="branding" type="object">
  Brand settings applied to the flow.

  <Expandable title="properties">
    <ParamField path="name" type="string">
      Brand name shown in the flow.
    </ParamField>

    <ParamField path="primaryColor" type="string">
      Primary brand color as a hex value, for example `#0f2638`.
    </ParamField>
  </Expandable>
</ParamField>

## Callbacks

| Callback | When it runs |
| - | - |
| `onSuccess(investment)` | The user completes an investment. |
| `onClose()` | The user closes the flow. |
| `onError(error)` | The investment fails. |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.