Conditional formatting, style by value

Colour, highlight, bold, or italicise an element when a condition is true, e.g. turn a Status red when it reads "Overdue".

Conditional formatting changes how an element looks while a condition is true, without hiding it or making it read-only. Turn a value red when a Status reads "Overdue", highlight an Amount amber when it's over budget, or bold a field once it's been filled in. It's authored in the field's Rules tab, under Conditional formatting.

A rule has three parts

Property	Description
`When` expression	A true/false condition. The formatting applies while it is true. Blank ⇒ the rule does nothing.
`Apply to` the input · the whole field	Whether the style hits just the value control, or the whole field block (label + control + description).
`Style` text colour · background · border colour · bold · italic	The visual changes to apply. Set only the ones you want; the rest fall through to the element’s normal styling.

Examples

Turn an overdue status red and bold

When:      {Status} == "Overdue"
Apply to:  the input
Style:     Text colour = #b91c1c, Bold

Highlight a large amount

When:      {Amount} > 10000
Apply to:  the whole field
Style:     Background = #fef3c7

Flag a mismatch against a stored value

When:      {Total} != item["ApprovedTotal"]
Apply to:  the input
Style:     Border colour = #dc2626

Behaviour

Live. The condition re-evaluates every time a referenced field changes, the moment {Status} becomes "Overdue", the value turns red; change it back and the styling reverts.
Additive. Formatting never hides or disables anything, for that use visibleIf or enableIf.
Multiple rules stack. Several rules can be true at once; they apply in order, and a later rule wins for a property both set (e.g. two rules setting the text colour, the last matching one takes effect).
Border colour draws a border. Setting a border colour on an element that has no static border adds a 1px solid line so the colour is visible; a static border you set elsewhere still wins.
Fails safe. A blank or malformed When expression applies no formatting, a typo can never leave a value stuck in an alarming colour.

In code

Prefer no-code where you can, but the same effect is available from the f365 JS API for cases the rule can't express (animations, computed colours, reacting to non-field state):

The JS equivalent of the first example

f365.events.onChange('Status', () => {
  const el = f365.field('Status').el();
  const overdue = f365.field('Status').value === 'Overdue';
  el.style.color = overdue ? '#b91c1c' : '';
  el.style.fontWeight = overdue ? '700' : '';
});

visibleIf, conditional visibility
Hide or show any field, section, or button based on the value of other fields. Express the condition once; the runtime evaluates it on every change.
enableIf, conditional enable/disable
Grey out a field unless an expression returns true. The field stays visible, just locked from editing.
Placeholders & tokens
The unified placeholder model, {Field} form values, item["Field"] stored values, and [System] tokens, with an example for every field type.