# Image Rendering Reference

## Navigation:

Index General Information Elements Utils Examples

# The <rect> Element

## Description:

Defines a rectangle to be drawn onto the image. The rectangle will be drawn behind the field elements.

### Multiple Occurrences allowed: true

## Attributes

Name | Description | Inheritated | Possible Values | Default Value | Examples
--- | --- | --- | --- | --- | ---
class | A identifier of a CSS class. This identifier can be referenced via a CSS file. The same class identifier is meant to be used in multiple tags | false | String | No default value | css1
id | A identifier of the tag. This identifier can be referenced via a CSS file. This identifier has to be unique | false | String | No default value | css1
x | The position of the element on the x-axis in pixels | false | An integer value >= 0 and smaller than the specified image dimension | No default value | -
y | The position of the element on the y-axis in pixels | false | An integer value >= 0 and smaller than the specified image dimension | No default value | -
width | The width of the element specified in pixels | false | A size value in pixel | No default value | -
height | The height of the element specified in pixels | false | A size value in pixel | No default value | -
color | The color of the element or the contained text | true | black | white | transparent | semi-colon separated RGBA string with values between 0 and 255 | black | -
border | Specifies the thickness of the border around the element. A value of 0 means no border | false | An non-negative integer value (>0) | 0 | drawing1
border-color | Specifies the color of the used border | false | black | white | transparent | semi-colon separated RGBA string with values between 0 and 255 | black | -
border-style | Sets the line style of the border | false | dotted | dashed | solid | solid | -
fill | Specifies whether the element should be filled with the specified color or net | false | true|false | true | -
rounded-corners | Defines which of the corners should be rounded. Multiple corners can be specified using a colon (,) as separator. | false | top_left | top_right | bottom_left | bottom_right | No default value | drawing3
corner-radius | The radius of the rounded corners of the rectangle/field. Zero radius means no rounded corners. In case the corner radius is to large, it gets adjusted automatically. The maximum radius is (Min(width,height) - 1) / 2 | false | A size value in pixel | 0 | drawing3

## Child Elements

No child elements

## Examples

- Drawing Example
- Advanced Drawing Example