---
title: Beautify HTML
description: Learn how to beautify HTML in Reactiv to improve formatting and readability for webviews, content blocks, and in-app pages.
---

[Skip to content](https://info.reactiv.ai/reactiv-help-center/beautify-html-reactiv-support-center#main-content)

![logo-mono-light](https://info.reactiv.ai/hubfs/logo-mono-light.svg)

Open main navigation

Close main navigation

- [Contact us](https://info.reactiv.ai/reactiv-help-center/how-do-i-contact-customer-support-reactiv-support-center)

[Contact us](https://info.reactiv.ai/reactiv-help-center/how-do-i-contact-customer-support-reactiv-support-center?hsLang=en-ca)

 Answers, documented.

- There are no suggestions because the search field is empty.

1. [Reactiv Help Center](https://info.reactiv.ai/reactiv-help-center?hsLang=en-ca)
2. [Building Your App](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca)
3. [App Settings](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#app-settings)

February 18, 2026

# Beautify HTML

## How to configure and use the HTML Beautify feature in the Reactiv dashboard. This setting helps you control how HTML content is processed and displayed throughout your mobile app.

![](https://info.reactiv.ai/hs-fs/hubfs/Knowledge%20Base%20Import/Screenshot_2025-10-07_at_12.09.53%E2%80%AFPM-1759857005-Feb-13-2026-07-12-38-3919-PM.png?width=40&height=40&name=Screenshot_2025-10-07_at_12.09.53%E2%80%AFPM-1759857005-Feb-13-2026-07-12-38-3919-PM.png) Written by Reactiv App

The **HTML Beautify** feature ensures HTML content looks clean, consistent, and aligned with your app’s design system. When enabled, Reactiv removes unwanted inline styling and specific HTML elements so your app’s typography, spacing, and colors stay uniform.

HTML Beautify is enabled by default, but you can turn it on or off at any time from your App Settings.

---

### How to Access the Beautify HTML Setting

You’ll find this setting in the **Brand** page of your App Settings. To get there:

1. Open the **Reactiv Dashboard**.
2. In the Reactiv Dashboard select **App Studio**.
3. Click your **company logo** at the top of the page and select **App Settings**.
4. From the top menu, click **Brand**.
5. Scroll to the **Beautify HTML** option.
6. Toggle the setting **On** or **Off**.
7. Click **Save** to apply your changes.

---

### What HTML Beautify Does

When **HTML Beautify** is **enabled**, Reactiv automatically cleans and restyles HTML content to ensure a consistent appearance across your app.

### 1. Style Stripping

Reactiv removes the following inline CSS properties:

- **Font properties:** fontFamily, fontStyle, fontVariant, fontWeight, fontSize
- **Borders:** all border widths and colors
- **Text alignment:** textAlign
- **Background colors**
- **Spacing:** all margins and paddings

**Exception:** Images hosted at `dashboard.reactivapp.com/assets` keep their inline styles.

### 2. Element Removal

The following elements are removed automatically:

- `<br>` (line breaks)
- `<button>`
- `<iframe>`
- `<center>`
- `<meta>`

3\. Empty Element Cleanup

Reactiv removes empty HTML elements such as:

- Empty `<p>`
- Empty `<span>`
- Empty `<em>`
- Empty `<strong>`
- Empty headings (`<h1>`–`<h6>`)

### 4. Consistent Styling

When enabled, Reactiv applies your app’s theme automatically:

- Typography follows your design system
- Colors adjust for light/dark mode
- Spacing is standardized
- Lists and headings receive clean, predictable margins

---

### When HTML Beautify Is Disabled

If you disable this setting:

- Most inline HTML styles are preserved
- Only `<button>` and `<iframe>` elements are removed
- CSS stripping is disabled
- Empty elements are not automatically cleaned up

This mode is useful when you need precise control over styling or are displaying complex third‑party HTML.

---

### Use Cases

### Enable HTML Beautify When:

- You want a consistent, brand‑aligned look across all HTML content
- Your HTML includes conflicting or messy inline styling
- You need theme‑aware content (light/dark mode)
- You want content to follow accessibility and readability standards
- Your team uses rich text editors that add heavy or unnecessary styling

### Disable HTML Beautify When:

- Your HTML includes custom layouts or precise styling
- You’re displaying third‑party content that must remain unchanged
- Your content depends on intentional inline styles

---

### Troubleshooting

### Problem: HTML looks different than expected

**Solution:** HTML Beautify may be enabled. Set to **false** to preserve original styling.

### Problem: Custom HTML layouts appear broken

**Solution:** Disable HTML Beautify to prevent stripping of inline styles.

### Problem: Missing line breaks or spacing

**Solution:** `<br>` tags are removed when Beautify is enabled. Disable this setting if you need to keep manual line breaks.

---

### Support

If you need help configuring this setting, contact the Reactiv App Mobile support team. Include:

- Your app UUID
- Your current configuration settings
- Examples of HTML content to review
- Screenshots (if helpful)

We’re here to make sure your HTML content looks and performs exactly how you want it to.

- [Getting Started With Reactiv](https://info.reactiv.ai/reactiv-help-center/getting-started-with-reactiv?hsLang=en-ca)
- [Building Your App](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#main-content)

    - [App Settings](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#app-settings)
    - [Your Home Screen](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#your-home-screen)
    - [Misc. App Building Blocks](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#misc-app-building-blocks)
    - [Other Screens](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#other-screens)
- [Publishing Your App](https://info.reactiv.ai/reactiv-help-center/publishing-your-app?hsLang=en-ca#main-content)

    - [iOS App](https://info.reactiv.ai/reactiv-help-center/publishing-your-app?hsLang=en-ca#ios-app)
- [Building Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#main-content)

    - [Success with Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#success-with-reactiv-clips)
    - [Customizing Your Reactiv Clips Experiences](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#customizing-your-reactiv-clips-experiences)
    - [Initializing Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#initializing-your-reactiv-clips)
    - [About Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#about-reactiv-clips)
- [Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#main-content)

    - [Analytics & Push Notifications](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#analytics-push-notifications)
    - [App Install Attribution](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#app-install-attribution)
    - [Back in Stock Alerts](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#back-in-stock-alerts)
    - [Chat & Customer Support](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#chat-customer-support)
    - [Conversion Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#conversion-integrations)
    - [Discovery, Search & Personalization](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#discovery-search-personalization)
    - [Fraud Protection](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#fraud-protection)
    - [Loyalty](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#loyalty)
    - [Order Fulfillment](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#order-fulfillment)
    - [Product Recommendations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#product-recommendations)
    - [Order Tracking & Returns](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#order-tracking-returns)
    - [Product Bundles](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#product-bundles)
    - [Reviews Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#reviews-integrations)
    - [Subscriptions](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#subscriptions)
    - [Video Shopping](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#video-shopping)
    - [Wishlist Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#wishlist-integrations)
    - [Profile Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#profile-integrations)
- [Platform Highlights](https://info.reactiv.ai/reactiv-help-center/platform-highlights?hsLang=en-ca)
- [Success with Reactiv](https://info.reactiv.ai/reactiv-help-center/success-with-reactiv?hsLang=en-ca#main-content)

    - [Sending Push Notifications](https://info.reactiv.ai/reactiv-help-center/success-with-reactiv?hsLang=en-ca#sending-push-notifications)
- [Building with AI](https://info.reactiv.ai/reactiv-help-center/building-with-ai?hsLang=en-ca)
- [FAQ](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#main-content)

    - [Performance & Data](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#performance-data)
    - [General & Billing](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#general-billing)
    - [Getting Started](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#getting-started)
    - [Technical Issues & Troubleshooting](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#technical-issues-troubleshooting)
    - [App Management](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#app-management)
- [Research](https://info.reactiv.ai/reactiv-help-center/research?hsLang=en-ca)

[![logo-mono-dark](https://info.reactiv.ai/hubfs/logo-mono-dark.svg "logo-mono-dark")](http://reactiv.ai)

<https://www.linkedin.com/company/reactivapp/>

Copyright © 2026, Reactiv