Text Dividers

Text dividers and line separators: how they are built

A text divider is a row of Unicode characters pasted on a line of its own, so it works in any field that keeps line breaks and symbols. It is ordinary text: it wraps, resizes and changes with the font like the words around it.

Why some lines are solid and others are dotted

The cleanest rules use box-drawing characters such as ─, ━ and ═. They were made for drawing tables in text terminals, so each one reaches the full width of its cell and meets its neighbour without a gap. Stars, bullets and hearts sit inside their cells with space around them, which gives a dotted or beaded line. In a font that was not designed for box drawing, hairline gaps can appear between the pieces, so judge a divider in the app where it will be read.

Getting the length right

A divider does not stretch to fit the screen. On a narrow phone a long one wraps onto a second line and reads as two broken rules. Dividers built from full-width characters such as ～ or ・ take about twice the room per character of the others. After pasting, look at the result on a phone, and shorten it by deleting characters from the middle so the two ends stay symmetrical.

Dividers and screen readers

A screen reader may read a divider character by character, repeating a name such as box drawings light horizontal for every piece, or pass over it silently. Neither helps a listener. In a bio or caption, one short divider is a fair compromise. On a web page or in a document, use the horizontal rule the editor provides, and keep text dividers for places that offer no formatting.

More questions

How do I make a divider longer or shorter?

Copy one repeating character from the middle and paste it again to lengthen the line, or delete characters from the middle to shorten it. Editing the middle keeps the end ornaments matched.

What is the difference between a divider and a spacer?

A divider is a visible line of symbols. A spacer is a blank gap or empty line, which needs an invisible character such as the ones on the invisible space page, because many apps collapse ordinary empty lines.

Why do the heart dividers look different on another phone?

Dividers that contain emoji, such as the red heart, are drawn by each platform's own emoji artwork. The line characters between them come from the text font, so the two parts can change independently.