Appearance
Style Properties
All properties available inside <styles> rules, organised by category.
Usage
xml
<styles>
<tag-name>
<property-name>value</property-name>
</tag-name>
</styles>Length units
length in the tables below means a number with a unit: pt (points), cm, mm or in. There are 72 points and 2.54 centimetres to the inch, so 1in, 72pt, 2.54cm and 25.4mm all describe the same length. Where a property also accepts a share of its parent, % is listed beside it.
Layout Properties
| Property | Valid Values | Applies To |
|---|---|---|
width | length, %, fill, auto | Blocks |
height | length, %, fill, auto | Blocks |
min-width | length, % | Blocks |
max-width | length, % | Blocks |
min-height | length, % | Blocks |
max-height | length, % | Blocks |
direction | column, col, row | Frames |
h-align | left, center, right, justify | Blocks |
v-align | top, center, bottom, justify | Blocks |
Typography Properties
| Property | Valid Values | Applies To |
|---|---|---|
font | Font name | All |
font-size | pt | All |
font-style | normal, bold, italic | All |
font-weight | 100-900, named weight | All |
font-color | Colour value | All |
text-align | left, right, center, justify | All |
line-height | Number or pt | All |
text-decoration | none, underline, strikethrough | Inlines |
text-shadow | pt | All |
text-shadow-color | Colour value | All |
preserve-whitespace | true, false | All |
wrap | normal, none | All |
overflow | visible, ellipsis | All |
text-transform | uppercase, lowercase, capitalize, upper, lower, title | All |
case | Alias for text-transform | All |
Spacing Properties
| Property | Valid Values | Applies To |
|---|---|---|
padding | length | Blocks |
padding-top | length | Blocks |
padding-bottom | length | Blocks |
padding-left | length | Blocks |
padding-right | length | Blocks |
space-before-desired | length | Blocks |
space-after-desired | length | Blocks |
Border Properties
| Property | Valid Values | Applies To |
|---|---|---|
border-weight | length | Blocks |
border-weight-top | length | Blocks |
border-weight-bottom | length | Blocks |
border-weight-left | length | Blocks |
border-weight-right | length | Blocks |
border-color | Colour value | Blocks |
border-color-top | Colour value | Blocks |
border-color-bottom | Colour value | Blocks |
border-color-left | Colour value | Blocks |
border-color-right | Colour value | Blocks |
border-radius | length | Blocks |
border-radius-tl | length | Blocks |
border-radius-tr | length | Blocks |
border-radius-bl | length | Blocks |
border-radius-br | length | Blocks |
Appearance Properties
| Property | Valid Values | Applies To |
|---|---|---|
background-color | Colour value | Blocks |
color | Colour value | hr |
Breaking Properties
| Property | Valid Values | Applies To |
|---|---|---|
break | auto, never | Blocks |
prevent-last | true, false | Blocks |
orphan-lines-threshold | Number | Blocks |
Colour Values
Anywhere a colour is expected, these formats are valid:
| Format | Example |
|---|---|
| Hex short | #09f |
| Hex full | #0099ff |
| Hex with alpha | #0099ff80 |
| RGB | rgb(0, 153, 255) |
| RGBA | rgba(0, 153, 255, 0.5) |
| HSL | hsl(210, 100%, 50%) |
| Named | white, black, grey, red, etc. |
| Asset colour | Name from <assets><colors> |