FREEoverlay

Tooltip

The Tooltip is a compact, pointer-tipped bubble that explains a control or field on demand. Power Apps has no real popover control, so this is a styled group you show with a variable — perfect for inline help, validation hints and feature explanations without cluttering the screen.

Power Apps locale:

Paste directly into Power Apps Studio

This field is required to submit.

YAML source

# Tooltip — PowerBlocks (FREE)
# A small text bubble with a pointer, shown on hover/press via a variable.
# STEP 1 — Show it from a control's OnSelect or a hover icon:  Set(varTip, true)
# STEP 2 — Paste; position it next to the element it explains.

- Tooltip:
    Control: GroupContainer@1.3.0
    Variant: ManualLayout
    Properties:
      X: =40
      Y: =40
      Width: =220
      Height: =60
      Visible: =Coalesce(varTip, false)
    Children:
      - TipBubble:
          Control: Rectangle@2.3.0
          Properties:
            X: =0
            Y: =0
            Width: =220
            Height: =48
            Fill: =RGBA(31, 41, 55, 1)
            RadiusTopLeft: =10
            RadiusTopRight: =10
            RadiusBottomLeft: =10
            RadiusBottomRight: =10
      - TipText:
          Control: Label@2.5.1
          Properties:
            Text: ="This field is required to submit."
            X: =12
            Y: =0
            Width: =196
            Height: =48
            VerticalAlign: =VerticalAlign.Middle
            Color: =RGBA(229, 231, 235, 1)
            Size: =11
      - TipArrow:
          Control: Image@2.2.3
          Properties:
            X: =24
            Y: =44
            Width: =16
            Height: =10
            Image: ="data:image/svg+xml;utf8, " & EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'><path d='M0 0 L8 10 L16 0 Z' fill='#1F2937'/></svg>")

Common use cases

Inline help

Explain an icon-only button or a field on hover/press.

Validation hints

Show why a field is required or invalid.

Onboarding nudges

Point out a feature the first time a user lands.

How to use Tooltip in Power Apps

1Set varTip from a hover icon or a control's OnSelect.
2Choose your locale (EN or FR) and click "Copy YAML".
3Paste the control and position the bubble next to its target.
4Edit the bubble text and flip the arrow if the tooltip sits below the element.

Tip — Use a context variable per tooltip (e.g. locTipName) so multiple tooltips on a screen open independently.