--- title: "Change the design of the Tooltip" slug: "changing-the-design-of-the-tooltip" updated: 2026-08-06T15:17:49Z published: 2026-08-06T15:17:49Z canonical: "support.whatfix.com/changing-the-design-of-the-tooltip" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.whatfix.com/llms.txt > Use this file to discover all available pages before exploring further. # Change the design of the Tooltip Whatfix provides various customization options that enable you to change the look and feel of your Flows' tooltips according to your preferences. **Note:** Only an **Account Manager** can perform the following task. For more information about available roles, see [Whatfix User Roles](/studio/docs/whatfix-user-roles). Customize the design of your Flows' tooltips by setting the following: - A default style for all Flows - Individual style for each Flow Set a default style for all Flows          Info           When you set a default style, all Whatfix Flow tooltips get created with the same style. Use the following steps to set a default style for your account: 1. On the Whatfix Guidance dashboard, click **Style**. ![ia_left%20nav_style](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_left%20nav_style.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 2. Click **Flows**. ![ia_style_flows](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_style_flows.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. The **Flow** Style section has the following customizations that can be enabled across all Whatfix Flows: - **Tool Tip**: Configure tip appearance, select a color, format font, and text sizes, customize tip shapes and buttons. - **End Message**: Enable or disable the end message. Select colors, font sizes, and more for your end message text for all Flows. For more information, see [Customize the end message of a Flow](/desktop/docs/customizing-the-end-message-of-a-flow). ![Flow_theme.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Flow_theme.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. Expand **Interaction** and configure the following: - **Back Button**: Enable or disable the back button toggle. - **Step Number**: Enable or disable the step number toggle. - **Flow Name**: Enable or disable the flow name toggle. - **Next**: Enable or disable the next button toggle. - **'Next' button icon**: Enable or disable the next button icon toggle. ![Flow_interaction](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Interaction_Flow.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. Expand **Appearance** and select a tool tip theme from the available options. ![Change_appearance](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Change_appearance.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) Configure the following: - **Color**: Select a tip color from the existing color picker or enter the hex code of the desired color. - **Close (X) color**: Select a color for the **X** icon from the existing color picker or enter the hex code of the desired color. - **Corner Radius**: Add rounded corners for your tips. - **Title**: Select font size, color, and style of the Tool Tip Title. - **Description**: Select font size, color, and style of the Tool Tip text. - **NEXT Button**: Configure the button color, text color, hover button color, and hover 'Next' color. - **Flow Name Text**: Select the Flow Name text style, font size, and color. ![Flow_appearance.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Flow_appearance.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D)          Note           All colors and fonts can be customized in each appearance. 1. Click **Save** to save the changes. ![Click_save.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_save%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D)          your title goes here           If you click **Discard changes**, all the modifications you've made to the content will be lost, and the page will revert to its previous saved state. ![Click_Discard](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Discard.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) Set individual style for each Flow          your title goes here           The appearance of individual Flows can also be customized during Flow creation. For more information, see [Create a Flow](/desktop/docs/creating-a-flow). Use the following steps to set individual style for each Flow: 1. On the Whatfix Guidance dashboard, click **Content**. ![ia_left_nav_content](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_left_nav_content.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 2. Click **Flows**. ![ia_left%20nav_flows](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_left%20nav_flows.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 3. Hover your cursor over the required Flow, and then click the **Edit** icon. ![image.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image-QSOJQNUO.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 4. Click the **More** icon, and then select **Customize**. ![db_flow_customize](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/db_flow_customize.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) Info Whatfix Content and Widgets can be edited in the **Draft** and **Ready** Stages. 1. The **Flow Theme** section has the following customizations that you can enable for a Flow: - **Tool Tip**: Configure tips, select a color, format font, and text sizes, customize tip shapes and buttons. - **End Message**: Enable or disable the end message. Select colors, font sizes and more for your end message text for all Flows. For more information, see [Request feedback at the end of a Flow](/desktop/docs/customizing-the-end-message-of-a-flow). ![CLMDashboard_individual_flow_themes](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/CLMDashboard_individual_flow_themes.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. Choose a tool tip theme from the available options. ![Dashboard_contheme_tooltheme](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Dashboard_contheme_tooltheme.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) **Here's how each theme modifies the tool tip appearance** ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Tooltip5%20%281%29.gif?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D)     ---          Note           All colors and fonts can be customized in each theme. 1. Expand **Tip Configuration** and configure the following: - **Color configuration**: Select from the existing color picker or pass the hex code of the desired color. - **Text Configuration**: Select font size, color, and style of the tool tip text. - **Next Button**: Select to show or hide the **NEXT** button, configure the appearance style, customize button, and text color. ![Dashboard_theme_tipconfig](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Dashboard_theme_tipconfig.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. Expand **Other Configuration** and configure the following: - **Back Button**: Choose to show or hide back button - **Step Number**: Choose to show or hide step number - **Flow Name**: Choose to show or hide Flow name - **Flow Name Text**: Choose font size and color for the Flow name - **Corner Radius**: Add rounded corners for your tips ![Dashboard_theme_otherconfig](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Dashboard_theme_otherconfig.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A01%3A38Z&se=2026-11-12T10%3A01%3A38Z&sr=c&sp=r&sig=vtGmoKBaw%2BVAvZH%2BVL3C1HWFZ4fVlEJ15gxrpRuNzWQ%3D) 1. Click **Save**.