Why Does ASCII Art Look Stretched? Fix Proportions and Wrapping

Fix stretched ASCII art by checking character proportions, monospace fonts, line spacing and wrapping. Compare the same text at two line heights.

By Image to ASCII · Updated October 6, 2026

ASCII art looks stretched when character-cell proportions, the font or line spacing do not match the grid used to create it. Automatic wrapping can also break the shape. Reduce columns for a width problem; use a monospace font and suitable line height for a proportion problem.

First distinguish three failures

What you see	Likely cause	Try
Every shape looks taller	Cell ratio or excessive line height	Check the font and line spacing
Columns drift sideways	A proportional font	Use a monospace code block
Rows split into extra lines	Wrapping or too many columns	Use a narrower result or PNG

Same characters, different line height

Both panels contain the exact same 40 × 19 fox text, with the same Courier New font and 10px size. Only line height changes: 1.25 versus 2.0. This isolates a viewing problem; it is not a different conversion.

Line height 1.25

                                        
                                        
        *#                    #+        
       #*+##                ##=*#       
       #*+####            ####+*#       
      ##**+#####        #####=**#       
      ##**+=################=+**##      
       #**+*###############+*+**#       
        *+####################+*        
        #*##########*#########*#        
      ######  ######*#####  ######      
     +######### ####*#*# *########+     
       #**++=###*######*###-++***       
          #**+=#######=##-+**#          
               +######*#=               
                  #  *

Compact rows preserve the intended silhouette.

Line height 2.0

                                        
                                        
        *#                    #+        
       #*+##                ##=*#       
       #*+####            ####+*#       
      ##**+#####        #####=**#       
      ##**+=################=+**##      
       #**+*###############+*+**#       
        *+####################+*        
        #*##########*#########*#        
      ######  ######*#####  ######      
     +######### ####*#*# *########+     
       #**++=###*######*###-++***       
          #**+=#######=##-+**#          
               +######*#=               
                  #  *

Extra vertical spacing makes the same fox taller.

Download the identical text used in both panels.

How this converter compensates

Text cells are generally taller than they are wide. Our current sampling uses:

rows = round(columns × image height / image width × 0.48)
80 columns × 1 (square image) × 0.48 = 38 rows

The 0.48 factor is this tool’s implementation choice, not a universal font ratio. The destination can use a different font or line spacing. Changing width keeps this factor, so a smaller output does not automatically correct a tall font.

Fix the destination

Keep the original spaces and line breaks.
Paste into a fenced code block for GitHub or Discord.
In your own webpage use a monospace font and preserve whitespace.
If lines still wrap, reduce columns and test a narrow screen.
Export PNG or SVG when the exact visual appearance matters.

pre.ascii {
  font-family: "Courier New", monospace;
  white-space: pre;
  overflow-x: auto;
  line-height: 1.25;
}

The CSS line height is a starting point for that font, not a rule for every font. PNG/SVG preserve a rendered layout; plain TXT remains characters whose appearance depends on the viewer.

Try a compensated example ↗Compare narrower widths

Why do Blocks behave differently?

Blocks uses Unicode shading characters. Font fallback and symbol metrics can differ from ordinary ASCII. Compare Simple or Dense first when portability matters; see the character ramp guide.