Tile style
A tile style says how a tile looks. Every property is optional. Where a tile leaves one out, the dashboard’s tileStyle gives it; where that leaves it out too, the default below.
A tile style is written in these places:
- a dashboard’s
tileStyle: every tile’s style; - a tile’s or a group’s
style: over the dashboard’s; - a value tile’s style rules (
styleRules[].style): over the tile’s own, while the rule holds; - a tile style to pick (
tileStyles[].stylein a dashboard, and style files).
Sizes are in pixels. A colour may be none where its type says so: no background, border or icon background at all.
| Field | Type | Default | What |
|---|---|---|---|
background |
colour or none |
#151515 |
Background. |
padding |
number, at least 0 | 5 |
Padding. Room inside the tile, in pixels. |
radius |
number, at least 0 | 4 |
Corner radius. In pixels. |
border |
colour or none |
none |
Border. |
borderWidth |
number, at least 0 | 2 |
Border width. In pixels. |
title |
colour | #ffffe0 |
Title. The title and its icon. |
titleHeight |
number, at least 0 | 26 |
Title height. In pixels. |
titleBackground |
colour or none |
none |
Title background. Out to the edges of the tile. |
titleUppercase |
true or false |
true |
Title in capitals. |
titleAlign |
one of left, center (Centre), right |
center |
Title alignment. Across its row. |
text |
colour | the tile type’s own | Text. Where the tile has no colour of its own for it. |
gaugeStyle |
one of ticks, arc, marker, needle, half, ring, rings, blocks, glow, bar, cells, thermometer, tank, bullet, dots, minimal |
ticks |
Gauge style. How a gauge or dial is drawn. |
valueAlign |
one of left, center (Centre), right |
center |
Value alignment. A value tile’s number and its unit; a gauge stays in the middle. |
captionSize |
number, 10 to 400 | 60 |
Caption size. In percent of the title height. |
captionColor |
colour | #808080 |
Caption colour. |
captionAlign |
one of left, center (Centre), right |
the value’s | Caption alignment. As the value when left out. |
iconPosition |
one of top-left, top-center (Top middle), top-right, bottom-left, bottom-center (Bottom middle), bottom-right |
top-right |
Icon position. A corner, or the middle of the top or bottom edge; over the title and the content. |
iconSize |
number, at least 0 | 30 |
Icon size. In pixels; with a background, the size of the background. |
iconColor |
colour | the title’s | Icon colour. The title’s when left out. |
iconBackground |
colour or none |
none |
Icon background. |
iconRadius |
number, at least 0 | 0 |
Icon corner radius. Of its background, in pixels; half the icon size makes a circle. |
iconMargin |
number, at least 0 | 0 |
Icon margin. Room between it and the tile’s edges, beyond the padding, in pixels. |
showBackground |
true or false |
true |
Background, border and shadow. Off: none of them, whatever they are set to; for a tile laid over others. |
shadow |
true or false |
false |
Shadow. |
shadowColor |
colour | #30000000 |
Shadow colour. With its opacity: #aarrggbb. |
shadowX |
number | 0 |
Shadow across. In pixels; below 0 to the left. |
shadowY |
number | 0 |
Shadow down. In pixels; below 0 upwards. |
shadowBlur |
number, at least 0 | 2 |
Shadow blur. In pixels. |
The background, the border and the shadow are not drawn when showBackground is false, whatever they are set to.