# Create Rich ToolTips for InputPanel Items
Add rich tool tips for items in the form-like control InputPanel. Award-Winning Suite of Controls for .NET Development. Read the documentation to know more.
## Content
InputPanel provides a ToolTip Editor which lets you create rich tooltips for input components. This topic describes how you can use this editor to create a rich tooltip for the InputButton component at design time and through code.
### At Design Time
1. Click InputPanel smart tag () to open the **InputPanel Tasks** menu.
2. Click the **Add New Item** combo box to select a component to be added, say InputButton.
**Observe**: The InputButton component is added to the input panel.
3. Select the InputButton and go to **Properties** window.
4. Locate the **ToolTipText** property and click the ellipsis button.
5. The **ToolTipText** **Editor** opens with the **Office** tab page in focus.
6. Complete the following tasks in the **Office** tab page:
1. Set the **Title**, say "ToolTip Tutorial".
2. Click the **Image** drop-down and select **(Add Image...)** to display the **Open** dialog box. Browse to select a small icon size image (preferably, 16x16 pixels) and click **Open**.
3. To display a separator between tooltip title and the body text, check the **Top Separator** checkbox.
4. Type the tooltip main text into the **Body Text** text box.
5. To display a separator between the body text and subtitle, check the **Bottom Separator** box.
6. Type in the subtitle in **SubTitle** textbox. You can also add a subtitle image using the **Subimage** dropdown.
**Observe**: The **Preview** pane displays a preview of the tooltip.
> type=note
> **Note**: You can also style title, body text and subtitle texts using the quick toolbar given on the top of Office tab.
7. Switch to the **Html** tab to get an HTML view of customization done so far. You can further customize the tooltip by editing the HTML part. In this example, we have enclosed a part of body text in ``tag to change the text color to blue. Also, we have enclosed a part of subtitle in `` tags to create a hyperlink.
8. Switch to the **Properties** tab and set some properties for further customization of tooltip. In this example, we have performed the following steps:
1. Set the **Border** property to **True**.
2. Set the **BorderColor** property to **RedOrange**.
3. Set the **Opacity** property to **80%**.
9. Click **OK** to close the **ToolTip Editor**.
10. Press F5 key to build the project.
**Observe**: Hover the mouse over input button to display the rich tooltip.
### At Runtime
1. Create an InputButton and add it to the InputPanel.
2. Set the **Text** property of InputButton, say "ToolTip Tutorial". **csharp**
```csharp
// Create an instance of InputButton to show tooltip on it.
InputButton btn = new InputButton();
btn.Text = "ToolTip Tutorial";
// Add it to InputPanel.
c1InputPanel1.Items.Add(btn);
```
**vbnet**
```vbnet
' Create an instance of InputButton to show tooltip on it.
Dim btn As InputButton = New InputButton()
btn.Text = "ToolTip Tutorial"
' Add it to InputPanel
c1InputPanel1.Items.Add(btn)
```
3. Set the **ToolTipText** property of the button. You can also use the HTML string to create a tooltip with title, subtitles etc. as shown in the code below. **csharp**
```csharp
btn.ToolTipText = @"
 |
Tooltip Tutorial |
This tutorial will help you:
- Learn how to set a tooltip.
- Learn how to style the tooltip.
 | +
Look for more tips |
Tooltip Tutorial |
This tutorial will help you:
- Learn how to set a tooltip.
- Learn how to style the tooltip.
| +
Look for more tips |