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

# Default frontend

> What the share link does out of the box — no SDK, no iframe code, no custom frontend.

When you share a project link like `https://share.streampixel.io/{projectId}`, viewers get a fully working frontend with built-in handlers for messages from your Unreal app. You don't need to write any frontend code to use these — they're handled automatically.

## What the default frontend handles

| Behavior                     | When it triggers                                                                                                                                                        |
| ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Open external URL**        | UE sends a URL string via `Send Pixel Streaming Response`. The frontend opens it in a new browser tab.                                                                  |
| **Take a screenshot**        | UE sends `{"message": "requestScreenshot"}`. The frontend captures the current frame and downloads it.                                                                  |
| **Show on-screen keyboard**  | UE sends `showOnScreenKeyboard`. The frontend opens a text input modal and sends the entered text back.                                                                 |
| **Toggle hovering mouse**    | UE sends `{"message": {"type": "togglehoveringmouse", "value": true/false}}`. The frontend shows or hides the browser cursor.                                           |
| **Built-in voice/text chat** | If enabled in project settings — chat UI appears automatically or on app trigger. See [voice and text chat](/resources/quick-start-guide/built-in-voice-and-text-chat). |

## Sending data from your page to UE (URL params)

If you only need to pass values **once at session start**, append them as query params to the share URL — no frontend code needed.

```
https://share.streampixel.io/{projectId}?message=set&field=quality&value=4k
```

UE receives:

```json theme={"dark"}
{ "message": "set", "field": "quality", "value": "4k" }
```

See [Frontend side messaging](/resources/json-message-communication/frontend-side-sending-and-receiving-json) for the full URL syntax and the [URL Generator tool](https://urlgenerator.streampixel.io/).

## When to leave the default frontend

The default frontend is enough for most demos, configurators, and simple interactive experiences. Move to a custom frontend only when you need:

| Need                                                                                 | Use                                                                                                                                            |
| ------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------- |
| Send messages **during** the session (not just at launch)                            | [Iframe](/resources/iframe-integration/overview) or [Web SDK](/resources/web-sdk/getting-started/overview)                                     |
| React to UE events programmatically (custom JSON, not just URL opens or screenshots) | [Iframe](/resources/iframe-integration/frontend-and-application-communication) or [Web SDK](/resources/web-sdk/features/communicating-with-ue) |
| Custom HUD overlays, branded loading screens, complex UI                             | [Web SDK](/resources/web-sdk/getting-started/overview)                                                                                         |
| Embed in your own site without changing your frontend                                | [Iframe](/resources/iframe-integration/overview)                                                                                               |

## Next

<CardGroup cols={2}>
  <Card title="JSON messaging" icon="message-code" href="/resources/json-message-communication/overview">
    All three communication paths compared: URL params, iframe, SDK.
  </Card>

  <Card title="Branding" icon="palette" href="/resources/dashboard/branding">
    Customize logo, splash, and loading messages on the default frontend.
  </Card>
</CardGroup>
