Free tools Windows power users keep installed
One-click scans. No signup required.
iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
You add a shape in Hostinger AI Builder manual mode by opening Add elements in the editor, dragging Shape onto your page, and then selecting it to adjust its form, color, size, and rotation. The whole process takes less than a minute once you know where the controls sit.
Adding a shape to your page
- Open your website in manual mode in the Hostinger AI Builder editor.
- In the left panel, expand Add elements.
- Find Shape and drag it onto the template where you want it to appear.
- Select the shape on the canvas to open its controls.
Hostinger’s help documentation for shapes specifies drag and drop. Its general guide to website elements also notes that elements can be clicked to insert them into a selected section, so use whichever method suits your layout.
Customizing a selected shape
Once a shape is selected, Hostinger’s shape guide lists these actions:
- Change shape: swap the geometric form.
- Change color: recolor the figure.
- Resize: adjust its dimensions directly on the canvas.
- Rotate: turn the shape directly on the canvas.
- Duplicate: create a copy of the shape.
- Hide on desktop or mobile: show the shape on only one device type.
- Delete: remove the shape from the page.
The shape guide does not give numeric dimensions or keyboard shortcuts, so resize and rotate by dragging on the canvas rather than expecting exact values.
#1 Best Overall
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Layering shapes and copying them
When shapes overlap text or images, use the element’s right-click menu. Hostinger’s element documentation lists four layering commands: Bring to front, Move forwards, Send to back, and Send backwards.
You can also copy and paste an individual shape. Hostinger’s copy-paste guide states that only one element can be copied and pasted at a time, so copy each shape separately if you need several.
Shape element, button shape, and image shape are different settings
Several controls in the editor use the word “shape,” but they change different things. Use this table to find the right one.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
| What you want to change | Setting to use | Where it lives |
|---|---|---|
| A decorative geometric figure added to the page | Standalone Shape element | Add elements → Shape, then select it on the canvas |
| The corner style or form of a button | Button shape | Global Website styles, or locally in supported button and form controls |
| The outline of a photo or image | Shape option for an image element | Settings for the selected image element |
| Spacing and alignment of content blocks | Section layout settings such as snapping and row spacing | Section layout settings |
If you select an image and look for a shape control, you are in the image settings, not the standalone Shape element. Likewise, a button’s rounded or square look will not change when you resize a decorative shape.
Rank #3
Desktop and mobile visibility
The shape controls let you hide a shape on desktop or on mobile. This is useful when a decorative figure crowds a small screen. Hostinger’s broader manual-mode guide describes a separate mobile editor, so check the mobile view after you adjust any shape to confirm how it appears on phones.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Notes on accuracy and currency
The steps above reflect Hostinger’s help documentation as checked in October 2026. Editor labels, menu positions, and available controls can change with product updates, so if a label differs on your screen, look for the same function under a nearby name. The general element guide lists 15 website elements, with Shape among them; that count comes from Hostinger’s own documentation, and its publication year is not stated on the page.
Rank #4
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
Hostinger’s documentation covers the editor only. It does not describe how shapes behave after publishing, so verify the live page on both desktop and mobile after you publish.
Crashes, No Sound, or Screen Glitches?
Random freezes, missing sound and display glitches usually trace back to one bad driver. Find and replace yours safely.Free scan · under a minuteWindows Errors? Fix Them Before They Spread
Repair common Windows errors and clear accumulated junk for a smoother, more stable PC - no reinstall needed.Free scan · no reinstallQuick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
