Tooltip

The Tooltip component is a small pop-up box that appears when the user hovers or clicks on a UI element. It is commonly used to provide additional information or context to the user.

These demos showcase tooltips using TooltipService with string messages or HTML content, customizable positions (left/right/top/bottom), configurable delay and duration timing, close-on-page-click behavior, and attachment to both Radzen components and HTML elements.

NOTE: Please ensure you have reviewed the instructions in Get Started , as there are pre-requirements when using this component.

Show tooltip with string message link

Show string message tooltip when the user hovers a Radzen component.

Tooltip positions link

Place the Tooltip to the left, right, top, or bottom of a component.

Show tooltip with HTML content link

Show HTML content tooltip when the user hovers a Radzen component.

Tooltip delay and duration link

Show tooltip with delay when the user hovers a component and close it after 5 seconds.

Close Tooltip on page click link

Show styled tooltip on button click and close it on page click.

Tooltip on HTML element link

Show string message tooltip when the user hovers an HTML element.

All the tools in one place

Save Hours on Every Project

With Radzen Blazor subscription you get the full toolkit, including:

support

Dedicated support backed by proven expertise

palette

Premium themes and theme editor

widgets

Ready-to-use UI blocks

dashboard_customize

Complete app templates

format_shapes

Visual design-time-experience

Start Free See Subscription Plans

Radzen Blazor Components, © 2018-2025 Radzen.
Source Code licensed under MIT