> For the complete documentation index, see [llms.txt](https://docs.buildnatively.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.buildnatively.com/natively-platform/appearance/network-screen.md).

# Error Screen

### When Does the Error Screen Appear?

The Error Screen is displayed to users automatically whenever an underlying HTTP request fails completely. Common scenarios include:

* **Poor Network Conditions:** Extreme latency or intermittent internet drops.
* **Lost Signal:** Driving through tunnels or passing through dead zones.
* **Broken or Unsecured Links:** Accidental routing to insecure legacy paths (e.g., trying to access an `http://` address instead of a secure `https://` endpoint).

### Error Screen Layout Elements

You can customize the layout of your error fallback interface by toggling and configuring the following structural parameters within your platform dashboard:

1. **Background Color:** Define the base color fill for the entire screen background canvas.
2. **Text Field:** Display descriptive support guidelines directly over your color or asset layers. You can configure custom copy strings, font styling, scaling metrics, and coordinate alignments.
3. **Background Image:** Apply a full-screen contextual image or graphic overlay behind your structural elements.
4. **Image (Foreground):** Layer standalone graphical indicators, warning icons, or loaders.

### Configuring Background Graphics with AI

When the Background image switch is toggled active, you can generate or process your background image.

#### Method A: Text Descriptions via AI

As demonstrated in the screenshot, you can feed visual instructions straight to our generator engine:

1. Navigate to the **Describe with AI** configuration tab.
2. Type a thematic description into the box (e.g., *"A broken robot is trying to assemble itself"*).
3. Click the **Generate background** button to trigger processing.

<figure><img src="/files/qfS3j3H05g0dNSVSXE3O" alt=""><figcaption></figcaption></figure>

#### Method B: Manual Asset Uploads

If you already have designed error graphics ready for deploy:

1. Switch over to the **Upload image** configuration tab panel.
2. Drag and drop your file asset directly into the upload boundary box as illustrated in the screenshot.\
   **Asset Extension Rule:** All uploaded reference graphics must use standard PNG or JPG container formats.

<figure><img src="/files/3QThTU9iOU2bwVanBnek" alt=""><figcaption></figcaption></figure>

### Previewing, Removing, and Re-generating

Once your assets populate, they sync into the native device emulator viewport on the right edge of your dashboard, as seen in the screenshot.

<figure><img src="/files/qa6sa1vo7Obx2NZb1mPE" alt=""><figcaption></figcaption></figure>

* **Audit Aspect Layouts:** Verify that background focal points align correctly across standard mobile status bars and navigation panels.
* **Asset Deletion:** If a generated graphic context doesnt fit your design, click the red **Trash Can** icon. This wipes the canvas, letting you rewrite prompts or apply adjusted images.
* **Finalizing:** Press Next/Save to save state changes and commit your layout options.

### Continual Network Check Feature

For complex, single-page web applications (SPAs), we highly recommend enabling the Continual Network Check toggle setting found on your root screen dashboard page.

Why use this tool? Single-page web architectures do not naturally refresh or shift their URL endpoints during user actions. The Continual Network Check background service actively flags connection breaks without modifying or wiping out the page string position.

This critical tool prevents users from navigating deeper into stale cached app flows, filling out forms, or attempting database submissions while offline - saving them from permanently losing entered data.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.buildnatively.com/natively-platform/appearance/network-screen.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
