diff --git a/web/src/flow/FlowExecutor.ts b/web/src/flow/FlowExecutor.ts
index bde3616b52..f110a56ad6 100644
--- a/web/src/flow/FlowExecutor.ts
+++ b/web/src/flow/FlowExecutor.ts
@@ -36,6 +36,7 @@ import {
     ChallengeChoices,
     ChallengeTypes,
     ContextualFlowInfo,
+    FetchError,
     FlowChallengeResponseRequest,
     FlowErrorChallenge,
     FlowLayoutEnum,
@@ -205,7 +206,7 @@ export class FlowExecutor extends Interface implements StageHost {
             }
             return !this.challenge.responseErrors;
         } catch (exc: unknown) {
-            this.errorMessage(exc as Error | ResponseError);
+            this.errorMessage(exc as Error | ResponseError | FetchError);
             return false;
         } finally {
             this.loading = false;
@@ -237,15 +238,17 @@ export class FlowExecutor extends Interface implements StageHost {
             }
         } catch (exc: unknown) {
             // Catch JSON or Update errors
-            this.errorMessage(exc as Error | ResponseError);
+            this.errorMessage(exc as Error | ResponseError | FetchError);
         } finally {
             this.loading = false;
         }
     }
 
-    async errorMessage(error: Error | ResponseError): Promise<void> {
+    async errorMessage(error: Error | ResponseError | FetchError): Promise<void> {
         let body = "";
-        if (error instanceof ResponseError) {
+        if (error instanceof FetchError) {
+            body = msg("Request failed. Please try again later.");
+        } else if (error instanceof ResponseError) {
             body = await error.response.text();
         } else if (error instanceof Error) {
             body = error.message;
@@ -415,7 +418,8 @@ export class FlowExecutor extends Interface implements StageHost {
 
     async renderChallenge(): Promise<TemplateResult> {
         if (!this.challenge) {
-            return html``;
+            return html`<ak-empty-state ?loading=${true} header=${msg("Loading")}>
+            </ak-empty-state>`;
         }
         switch (this.challenge.type) {
             case ChallengeChoices.Redirect:
@@ -431,23 +435,21 @@ export class FlowExecutor extends Interface implements StageHost {
                 return await this.renderChallengeNativeElement();
             default:
                 console.debug(`authentik/flows: unexpected data type ${this.challenge.type}`);
-                break;
+                return html``;
         }
-        return html``;
     }
 
     renderChallengeWrapper(): TemplateResult {
         const logo = html`<div class="pf-c-login__main-header pf-c-brand ak-brand">
             <img src="${first(this.brand?.brandingLogo, "")}" alt="authentik Logo" />
         </div>`;
-        const fallbackLoadSpinner = html`<ak-empty-state ?loading=${true} header=${msg("Loading")}>
-        </ak-empty-state>`;
         if (!this.challenge) {
-            return html`${logo}${fallbackLoadSpinner}`;
+            return html`${logo}<ak-empty-state ?loading=${true} header=${msg("Loading")}>
+                </ak-empty-state>`;
         }
         return html`
             ${this.loading ? html`<ak-loading-overlay></ak-loading-overlay>` : nothing} ${logo}
-            ${until(this.renderChallenge(), fallbackLoadSpinner)}
+            ${until(this.renderChallenge())}
         `;
     }
 
diff --git a/web/src/flow/stages/FlowErrorStage.ts b/web/src/flow/stages/FlowErrorStage.ts
index 6e854c0a0d..f7a83ee88c 100644
--- a/web/src/flow/stages/FlowErrorStage.ts
+++ b/web/src/flow/stages/FlowErrorStage.ts
@@ -46,22 +46,26 @@ export class FlowErrorStage extends BaseStage<FlowErrorChallenge, FlowChallengeR
             </header>
             <div class="pf-c-login__main-body">
                 <form class="pf-c-form">
-                    <h3 class="pf-c-title pf-m-3xl">
-                        ${this.challenge?.error
-                            ? this.challenge.error
+                    <ak-empty-state
+                        icon="fa-times"
+                        header=${this.challenge.error
+                            ? html`${this.challenge.error}`
                             : msg("Something went wrong! Please try again later.")}
-                    </h3>
-                    ${this.challenge?.traceback
-                        ? html`<div class="pf-c-form__group">
-                              <pre class="ak-exception">${this.challenge.traceback}</pre>
-                          </div>`
-                        : html``}
-                    ${this.challenge?.requestId
-                        ? html`<div class="pf-c-form__group">
-                              <p>${msg("Request ID")}</p>
-                              <code>${this.challenge.requestId}</code>
-                          </div>`
-                        : html``}
+                    >
+                        <div slot="body">
+                            ${this.challenge?.traceback
+                                ? html`<div class="pf-c-form__group">
+                                      <pre class="ak-exception">${this.challenge.traceback}</pre>
+                                  </div>`
+                                : html``}
+                            ${this.challenge?.requestId
+                                ? html`<div class="pf-c-form__group">
+                                      <p>${msg("Request ID")}</p>
+                                      <code>${this.challenge.requestId}</code>
+                                  </div>`
+                                : html``}
+                        </div>
+                    </ak-empty-state>
                 </form>
             </div>
             <footer class="pf-c-login__main-footer">