Skip to lesson content

Ready-made shapes and lines

Last updated: September 8, 2026 · 4 min read

Add a shape or line and adjust its color, corners and geometry.

Ready-made shapes can be used as soon as you add them. Convert supported shapes to paths when you need to edit individual points.

Follow these steps

  1. 1

    Add a shape

    EditorOpen shape options

    Click the arrow beside the shape icon in the block toolbar. Choose a rectangle, ellipse, line, star or free-form shape. Choosing an item adds it to the page.

    Clicking the main shape icon adds the last selected preset again. For more options, open Elements → Shapes in the left library and click a shape.

  2. 2

    Position and resize it

    EditorCanvas

    Select and move the shape, then resize it with the selection handles. If it will hold an image, establish its frame size and position first.

  3. 3

    Set the fill and outline

    PropertiesFill Color

    For shapes other than lines, choose a fill color or transparency. In Stroke, adjust color, width and Solid, Dashed or Dotted style.

    A ready-made line has no fill or image controls. Use Line for its color and width and the Horizontal/Vertical buttons for orientation.

  4. 4

    Round a rectangle’s corners

    PropertiesCorner radius

    With a rectangle or rounded rectangle selected, change Corner radius. Unlink the corners with the link icon to set four separate values. Link them again to use a shared value.

    This control is not available on every shape type.

  5. 5

    Adjust stars and polygons

    PropertiesPoints:

    For a star, use Points to change its point count and Inner Ratio to change its indentation. A polygon displays the Sides field.

    The panel allows 3–12 points or sides. A star’s Inner Ratio ranges from 20% to 80%.

  6. 6

    Apply skew

    PropertiesTransform

    Open Transform and adjust Horizontal skew (X) and Vertical skew (Y). Reset clears both skew values.

    Skew slants the shape’s sides; it is different from rotation.

  7. 7

    Adjust shadow and blur

    PropertiesShadow

    For shapes other than lines, open Shadow. Use X/Y, Blur, Spread, color and Opacity to adjust the shadow. The separate Blur control at the bottom softens the shape itself.

    Shadow blur and shape blur affect different parts of the appearance.

Controls

The controls used in this lesson.

ControlWhere?What it does
Open shape optionsEditorChooses a shape preset to add.
Corner radiusPropertiesAdjusts shared or individual rectangle corners.
Points: / Inner Ratio:PropertiesAdjusts a star’s points and indentation.
Sides:PropertiesChanges the number of polygon sides.
TransformPropertiesApplies horizontal and vertical skew.

Result

Use the shape as a colored area, divider or image frame in your page design.

Troubleshooting

Point or side count is missing
These fields depend on the shape type. Choose a polygon rather than a fixed hexagon to use Sides.
I cannot add an image to a line
Ready-made lines do not support image fills. Use a rectangle, ellipse or suitable closed path.