How to Make Diagonal Text Online (Copy and Paste)

You can make diagonal text by putting each letter on a new line and adding more leading spaces as you go. Use the Diagonal Text Generator for a short phrase, then paste it into a surface that preserves whitespace. This creates a staircase of upright text, not a rotated font. The result can look different after pasting.

Where will you paste it?

Start with the field you intend to use. A message, an account handle and a profile description have different rules. Accepting Unicode does not mean accepting newlines or keeping leading spaces.

Destination	What is established	What you should check
Plain-text editor or document code block	The output contains ordinary text, padding and LF separators	Font, wrapping, tab behavior and whitespace preservation
Discord message code block	Discord documents multiline code blocks	Actual desktop/mobile appearance and the full message budget
Discord account username	Its documented character set excludes spaces and newlines	Use a readable handle instead of a staircase
Instagram, X, WhatsApp or other profile/message fields	This guide does not certify their field limits or paste behavior	Confirm the exact field accepts multiline text, preserves spaces and does not wrap the result

The Discord rows follow its official Markdown instructions and username rules. A display name is a different field; support for special characters is not evidence that a multiline layout will fit or display correctly.

A short example you can repeat

1. Open the generator and enter HELLO.
2. Choose Down-right, set Indent to 2, and leave Padding character blank.
3. Review the output and its complete size: 5 lines, 29 UTF-16 units.
4. Choose Copy Result. If copying fails, select the output and copy manually.
5. Paste into your intended field, check the preview, and compare it with the original HELLO.

The exact output is:

H
  E
    L
      L
        O

Those 29 units include 5 letters, 20 spaces and 4 LF line breaks. A destination may count differently, so treat this as the tool's count, not a platform limit.

Three directions, three offsets

Down-right increases the offset on each row. Up-right decreases it while retaining the input reading order. Zigzag alternates between two offsets; it does not trace a complete triangular wave.

HELLO settings	Leading padding repeats on its five rows	Complete output size
Down-right, indent 1, blank padding	0, 1, 2, 3, 4 spaces	19 UTF-16 units
Down-right, indent 2, blank padding	0, 2, 4, 6, 8 spaces	29 UTF-16 units
Up-right, indent 2, blank padding	8, 6, 4, 2, 0 spaces	29 UTF-16 units
Zigzag, indent 2, blank padding	0, 2, 0, 2, 0 spaces	13 UTF-16 units

This diagram illustrates ABC with Down-right and indent 2. Each letter stays upright; only its starting position changes. It is a spacing illustration, not a screenshot or measured platform rendering.

Keep accents and joined characters together

The generator uses grapheme segmentation through Intl.Segmenter. A base letter and its combining accent, or the parts of a joined emoji, stay on one output row. The underlying text is not converted into an ASCII font.

Whitespace-only graphemes are removed after segmentation. A mixed cluster containing whitespace and a non-whitespace mark stays intact, so removing a separator cannot accidentally attach a mark to a preceding letter. Segmentation depends on the runtime's Unicode version; an older browser without this feature shows an error.

A grapheme count is not a width measurement. CJK characters, emoji, bidirectional scripts and a custom padding grapheme may occupy different visual space. Blank padding uses ASCII spaces. A custom padding value must be one grapheme without tabs or line breaks; repeated combining marks can still look unlike a row of spaces.

Draft a Discord code-block message

For the HELLO example, add an opening line of three backticks and a matching closing line. This is the exact message draft, with no language tag:

```
H
  E
    L
      L
        O
```

The draft is 37 UTF-16 units: the 29-unit output plus two three-backtick fences and two extra LF separators. This fence example is safe for HELLO because it contains no backticks. For arbitrary text, inspect embedded backticks before wrapping it; this guide is not a general Markdown escaper.

Discord documents the code-block syntax. The message above is a constructed example, not a report of interactive testing in Discord. Before sending, inspect it on your actual device for font and line-wrapping changes. Keep a readable original available for people who find one-letter rows difficult to follow.

When the paste goes wrong

Spaces disappeared. The destination may collapse or trim whitespace. Try its documented code-block or preformatted option, if available. CSS whitespace rules explain this mechanism for web rendering, but do not establish how every app field behaves. Use the original phrase if the field cannot preserve the layout.

The shape looks uneven. A proportional font or a wide Unicode character can change alignment. Try a short ASCII word first. Do not assume a monospace font gives every grapheme the same width.

The generator reports a limit. Input is capped at 1,000,000 UTF-16 units and 20,000 retained graphemes. Output is capped at 5,000,000 units and checked before padding allocation. Down-right and Up-right padding grow quadratically with text length. Reduce the phrase or indent; a repeated multicode-unit padding grapheme also increases output size.

Copy fails. The output stays selectable. Use manual selection rather than assuming the clipboard changed. Browser paste and clipboard behavior can normalize line endings; inspect the final result instead of treating a source-level test as a device test.

You wanted centered lines or a colored picture. For ordinary leading-space alignment, use Center Text. Color is not part of a plain-text staircase. An image or HTML styling workflow has different output and paste requirements.