---
title: "Image to Text Ratio"
description: "Display the image-to-text ratio of a template directly inside the Topol editor preview, so users can spot image-heavy emails before sending."
url: https://docs.topol.io/email-editor/guide/image-to-text-ratio.html
---

# Image-to-text ratio

**The image-to-text ratio shows how much of a template's area is taken up by images.** Many email clients and spam filters treat image-heavy emails as promotional, which can affect inbox placement.

More background on the metric is in [this article](https://topol.io/blog/that-dreamy-text-image-ratio).

## Enabling the ratio

Add the following setting to your `TOPOL_OPTIONS`:

```ts
enableImageToTextRatio: true,
```

The option is off by default. Once enabled, a ratio label appears in the Top Bar while the editor is in Preview mode.

![Image to text ratio label](https://docs.topol.io/image-ratio-label.png)

Clicking the ratio label opens a description with more context.

![Image to text ratio description](https://docs.topol.io/modal-image-ratio.png)

## How the ratio is measured

The measurement is based on rendered area, not on the amount of written copy. In the rendered preview the editor sums two quantities. The **image area** is the on-screen area of every `<img>` element plus any table using a background image. The **non-image area** is the area of each content column that does not contain an image, measured after subtracting that column's padding.

The label reads as two percentages, image area first, expressed relative to the sum of those two areas. A template reported as `40:60` devotes 40% of the measured area to images.

The label is colored by three bands, where the ratio is image area divided by non-image area:

-   **Good**: below `2/3`, roughly 40:60 or less
-   **Middle**: between `2/3` and `1`
-   **Bad**: above `1`, meaning images cover more area than everything else

> **INFO**
>
> This feature is informational. Nothing is blocked or rewritten based on the ratio, and the value is recalculated from the live template each time the preview opens.
