Skip to main content

Rectangle block

You most commonly see rectanlge block in previus examples, because its a simple shape which is extends from shape block. Rectangles comes with a style customizations like backgroundColor, borderColor, borderWidth etc.

new Reactangle({width: 120, height: 60, backgroundColor: "black"})

Border Radius​

You can customize borders radius of rectanlge. Border radiuses comes as [top-left, top-right, bottom-right, bottom-left] format or you can just a pass one radius for all sides of the broder

new Reactangle({...options, borderRadius: [40, 50, 0, 0]})

Customizing Borders​

Borders is a customizable you can change style, color, width etc.

new Reactangle({...options, border: "30px solid white"})

You can also define which side of the border you want to customize.

new Reactangle({...options, borderTop: "30px solid white"})