Skip to main content

Mastering Text Auto Resize & Layout Harmony

Ensure your text always fits perfectly. Learn how to use presets, balance line lengths, and set line limits for automated designs.

Updated over a week ago

When generating high volumes of banners, text length can vary significantly. The Text Auto Resize feature ensures your copy stays within its container, maintaining a professional look without manual adjustments.

Pro Tip: Auto-resize effects are applied during the generation process. You will see these changes in your final exports, not in real-time within the Design Builder.


Choose your Resize Type

Abyssale offers three presets to handle how your text reacts to the container:

  • Keep text size: Maintains the original font size. If the text is too long, it will trigger an error unless truncation is enabled.

  • Shrink to fit: Starts at your defined font size and scales down only if the text exceeds the container.

  • Always fit: Dynamically scales the font size up or down to fill the container space perfectly.


Set Additional Constraints

Fine-tune your layout with advanced controls found in the Additional constraints menu:

  • Max lines: Define the maximum number of lines allowed. This prevents long text from expanding vertically and breaking your design layout.

  • Balance text visually (Text Harmony): This feature creates a more aesthetic "block" of text by ensuring line lengths are similar (within a 20% variance).

    • How it works: The system first micro-adjusts character spacing (up to ±20). If more correction is needed, it reduces the font size (up to -10px) to achieve a balanced look and avoid single-word lines.

  • Truncate text: This acts as a final fallback. If the text still cannot fit after all resizing attempts, Abyssale will cut the text and add an ellipsis (...) to the end to protect your design's integrity.


How to Activate Text Auto Resize

  1. Select a Text or Call to Action layer in the Design Builder.

  2. In the right-hand settings panel, toggle Text auto resize to ON.

  3. Choose your Type (Preset).

  4. Expand Additional constraints to set your Max lines, Harmony, or Truncation preferences.


Troubleshooting: "Text cannot fit within defined space"

This error occurs during generation when your text is too long to fit into its container, even after the Auto Resize logic has been applied. Since this feature works by calculating character count against your set constraints, an error means the system has "run out of room."

To resolve this and ensure your banners generate successfully, try the following:

  • Increase Max Lines: Allow the text more vertical space to wrap into additional lines.

  • Lower the Minimum Font Size: If using Shrink to fit or Always fit, give the system more "shrinking room" by decreasing the minimum allowed pixel size.

  • Enable Truncate Text: Toggle this on to allow Abyssale to automatically cut off overflowing text and add an ellipsis (...) as a final fallback.

  • Adjust Container Size: Return to the Design Builder and manually expand the text layer’s bounding box.

Need more help? Check out our guide on how the container system works in Abyssale to better understand how layer boundaries affect your designs.


Using the API

When generating via API, only send the fields that need to change.

Important: If your JSON payload includes a font_size value, it will override the Auto Resize settings. To ensure Auto Resize works correctly via API, do not specify a font size in your request.

Did this answer your question?