Interface Builder

Appearance

Hover Card Block ​

Type: Reference | Audience: Interface builder user

The Hover Card block shows a popup card when the user hovers over a trigger. The trigger can be text, an icon, or both.

Render mode showing a 'Hover me' trigger followed by a small question-mark icon, with the hover card popup 'Hover card content' visible just below it.

Settings ​

SettingDescription
Trigger TypePick Text Only, Icon Only, or Text + Icon -- what the user hovers over (default: Text Only).
Trigger TextThe trigger's visible text. Shown when Trigger Type is Text Only or Text + Icon. Supports the Data Picker.
Icon TypePick Warning (Triangle), Info (Exclamation), or Question (Help) (default: Question (Help)). Shown when Trigger Type is Icon Only or Text + Icon.
Icon ColorPick Gray (default), Red, Yellow, Blue, or Green.
ContentThe body of the popup card. Supports the Data Picker.
WidthPopup width in pixels, between 100 and 600 (default: 320).
AlignmentStart, Center (default), or End -- horizontal alignment of the popup relative to the trigger.

Builder view 'Hover Card Demo' with a Hover Card block selected on the canvas. The Block Settings sidebar shows the Configuration sub-tab populated: Trigger Type 'Text + Icon', Trigger Text 'Hover me', Icon Type 'Question (Help)', Icon Color 'Gray', Content 'Hover card content', Width 320, and Alignment 'Center'.

Style and Visibility ​

The Hover Card block uses the standard Style sub-tab (background, borders, radius) and Visibility sub-tab in Block Settings, the same as every other block. See Block Styles and Conditional Visibility.