RistmarkStart free

Block

Rectangle

A plain filled or outlined box — a coloured band, a highlight panel, or a frame to sit content on.

What it is for

A Rectangle is a simple shape with an optional fill colour, an optional outline and optional rounded corners. It holds no text of its own: other blocks sit above and below it. Use it for a coloured band, a highlight strip, or an empty frame such as "office use only".

Choose something else when you want colour behind a piece of content. Give that block its own fill, padding and border in its Box section: the colour then travels with the block, wraps its text and grows with it. A Rectangle cannot sit behind flowing content (see Troubleshooting). To draw a plain separator use a Line.

Add and edit it

Choose Rectangle from the Shapes group of the block palette, or search for "rectangle" or "box". Select it and edit it in the side panel. In the ordinary flow of the page a Rectangle takes a full-width band of its own and you set only its Height. Pin it with the Anchor button to place it at an exact spot, then drag it or its handles to size it.

Settings

  • Shape fill. The colour inside. Clear it for an outline-only shape that lets what is behind it show through. A new Rectangle has no fill.
  • Shape corner radius (millimetres, 0 or more; default 0). 0 is sharp; larger values round the corners, up to a pill shape at half the shorter side.
  • Shape outline. Thickness (default 0.35 mm), colour (default black) and line style (solid, dashed or dotted) as one control. Set the thickness to 0 for no outline. The outline is drawn along the edge of the shape and its thickness never changes the size the Rectangle takes.
  • Height (and width and position once it is pinned), in millimetres.
  • Box (see below), Visibility, and the other general sections.

The "Shape" labels exist because a Rectangle has two sets of fill, outline and corner controls: the shape's own, in the properties above, and the Box below them. They are different layers.

Shape versus Box

Every block has a Box: margin around it, padding inside it, plus a fill, a border and a corner radius. On a Rectangle the Box is the frame the shape sits in. Layers are painted in this order:

  1. the Box fill (the whole frame, including the padding);
  2. the shape (Shape fill and Shape outline) on top, inside the Box padding;
  3. the Box border, last, on top of everything.

With no Box padding the shape covers the Box fill completely. With padding the Box fill shows as a band around the shape. In effect, under the Box editor, says which fill and outline this Rectangle actually shows.

A Rectangle that has neither a Shape fill nor a Shape outline draws no shape at all (a corner radius alone paints nothing). It still appears as a selectable block in the editor, so it is easy to leave one behind by accident.

Variations and combinations

Highlight band. A 8 mm Rectangle with Shape fill pale yellow #fef3c7, outline thickness 0, placed above a notice. The example is rectangle-1.json. With days = "14" the page shows a yellow strip across the text width, then "Payment is due within 14 days of the invoice date." under it. (The band sits above the sentence, not behind it.)

Outline frame. A 20 mm Rectangle with no fill, a 0.5 mm blue outline #2563eb and corner radius 2 mm, under the line "Office use only:". The example is rectangle-2.json. The result is an empty rounded frame the staff can write in.

Framed paragraph through the Box. The same yellow note, but as a Text block whose own Box has a pale yellow fill, 3 and 4 mm padding, a 0.4 mm amber border and a 2 mm corner radius. The example is rectangle-3.json. The text now sits on the colour and the frame grows if the sentence wraps to a second line. This is usually the better choice for text.

Output differences

  • PDF and web page (HTML). Fill, outline, style and rounded corners are drawn as set.
  • Word (.docx). A Rectangle becomes an empty shaded and bordered paragraph at the text width. Fill, border colour and thickness carry over; rounded corners do not, and the paragraph is sized by Word rather than by your Height, so do not rely on an exact height there.

Troubleshooting

  • My text is covered by the rectangle. A pinned (anchored) Rectangle is drawn on top of the flowing content. Give the text block its own Box fill instead, or keep the Rectangle in the flow above it.
  • I cannot see my rectangle. It has no fill and an outline thickness of 0, or the colours match the page. Set a fill or a thickness above 0.
  • Two borders appear. One is the Shape outline and the other the Box border. Clear one.
  • The corners are not round. Check you set the Shape corner radius. Radius is capped at half the shorter side, so a very large value gives a pill, not a broken outline.
  • Rounded corners are missing in Word. Word does not keep them.