List of HCTML Symbols


The following table reports the full list of HCTML symbols that can be used to design the Panel. For a complete overview of the panel design rules, you can see the page design principles.

 

Symbol Type Description Details
! Styler Define the background color (or gradient) of object/container Details
# Styler Define the color of text and border Details
$ Macro Define the end of a macro definition Details
% Styler Define the size and scale of a container Details
& Tag Insert a little space into the panel layout Details
( Macro Used to specify parameters to a macro call Details
) Macro Used to specify parameters to a macro call Details
* Styler Define the size and of objects Details
+ / This symbol is ignored. It can be used to separate symbols -
- Styler Define type and size of borders Details
. Events Define events (when not used in numbers) Details
/ Tag Insert a vertical space into the panel layout Details
: Objects Used to separate parameters of an object definition Details
; Object Used to terminate an object definition Details
< Styler Align content at the left side of the container Details
= Tag Insert a horizontal line into the layout Details
> Styler Align content at the right side of the container Details
? Macro Used to declare a parameter in a macro definition Details
@ Styler Define the absolute position of a container/object Details
A Object Display an analog indicator Details
B Object Display a button Details
D Object Define the desktop properties Details
E Object Display an edit box Details
G Object Display a graph (plot) Details
I Object Display an image (picture) Details
J Macro Use a macro Details
K Macro Define a macro Details
L Object Display an indicator (LED) Details
M Object Display a dynamic message Details
R Object Display an analog control (slider) Details
S Object (virtual) Use a class of stylers Details
T Object Display a static text Details
W Object Display a switch Details
^ Styler Align content at center of container Details
_ Constructor (Underscore) Create a new line into the container Details
a Styler Rotate a container/object Details
a (Sub)-Styler Sub-style of f : set font arial Details
b Styler Align content at bottom of the container Details
b (Sub)-Styler Sub-style of f : specify font-bold
Sub-style of - : specify double border
Details
Details
c (Sub)-Styler Sub-style of f : specify font courier
Sub-style of - : specify border collapse
Details
Details
d Styler Displace the object/container position Details
d (Sub)-Styler Sub-style of - : specify border dotted Details
e (Sub)-Styler Sub-style of - : specify border separate Details
f Styler Define the font to be used Details
g Styler Set a background image for object/container Details
g (Sub)-Styler Sub-style of - : specify border groove Details
h Styler Define container shadow Details
h (Sub)-Styler Sub-style of - : specify border dashed Details
i (Sub)-Styler Sub-style of f : specify font italic Details
j (Sub)-Styler Sub-style of - : start debug border Details
k Styler Set the display style of an object/container Details
k (Sub)-Styler Sub-style of - : end debug border Details
m Styler Align the content in the middle of the container Details
n Styler Set the line height Details
n (Sub)-Styler Sub-style of f : disable font
Sub-style of g : specify background image not repeated
Details
Details
o Styler Set the opacity of object/container Details
p Styler Set the padding of the container Details
r Styler Set the border radius Details
s Styler Use a styler class Details
s (Sub)-Styler Sub-style of - : set border solid Details
t Styler Align content at the top of the container Details
t (Sub)-Styler Sub-style of h : set shadow for text Details
v Styler Set the vertical orientation Details
w Styler Set the overflow option Details
z Styler Set the z-index Details
{ Constructor Begin a container Details
| Constructor Insert a column into the container Details
} Constructor End a container Details
~ Styler Define a global ID (identifies an element on the panel)
Details