Shapes are great for adding CTAs, backgrounds and borders around the edge of your design. They can also be used to add simple rectangles and ovals to your design. In the example below, the adaptivebean.com CTA was added to the canvas using a Rectangle.



To add a shape to your canvas, open the Assets panel, tap the Objects tab and tap the Plus button for either a Rectangle or an Oval.



You can change the styling of a shape using the Shape Style options. To access the Shape Style options, select the shape element and open the Customize panel on the left-hand side of the editor. In the Customize panel, scroll down to the Shape Style options.



Using the Shape Style options, you can adjust the following properties of your shape:


Background Color


To change the background color of your shape, tap the bar of color next to Background Color option in the Shape Style. Tapping the bar of color will open the Flexitive Color Picker, where you can set the color and opacity of the shape. For information on how to use the colour picker, check out our article on the Flexitive Colour Picker.



Border Color


To change the border color of your shape, tap the bar of color next to Border Color option in the Shape Style. Tapping the bar of color will open the Flexitive Color Picker, where you can set the color and opacity of the shape. Instructions for how to use the color picker can be found here.



Border Width


To add a border to the outside of your shape, use the Border Width option the the Shape Style. The border width is set to 0% by default, and increasing the percentage will increase the thickness of the border.



Border Radius


For a rectangle, you can round the corners of your shape by changing the Border Radius. By default, the Border Radius is set to 0% and will have square corners, and increasing it will round the edges of the rectangle. Setting the Border Radius to 100% will completely round the edges to the shape of an oval.