New to Kendo UI for Vue? Start a free 30-day trial

Getting Started with Kendo UI for Vue Tooltips

Updated on Sep 9, 2026

This guide provides essential information about using the Kendo UI for Vue Tooltips package. You will learn how to install the package, add a Tooltip to your project, style the components, and activate your license. The steps apply to all Kendo UI for Vue Tooltips.

Before You Begin

To follow this guide, you need a Vue project. If you do not have one, create a Vue application with Vite by running the following command in your terminal:

npm create vite@latest my-app -- --template vue-ts

This guide requires basic knowledge of Vue and TypeScript.

Install the Component

To install the Tooltips package, run the following command in the root folder of your Vue project:

npm i @progress/kendo-vue-tooltip @progress/kendo-vue-popup @progress/kendo-theme-default

Import the Component

After installing the Tooltips package, import the desired component in your Vue application. This guide shows how to add the Tooltip.

vue

<script setup lang="ts">
import { Tooltip } from '@progress/kendo-vue-tooltip';
</script>

Use the Component

After installing the Tooltips package and importing the component, add a Button and the Tooltip to your application component.

vue

<template>
    <Tooltip :anchor-element="'target'" :position="'bottom'">
        <button title="Saves the current document">Save</button>
    </Tooltip>
</template>

Build and run the application by typing the following command in the root folder of your project:

npm run dev

Style the Components

Import a Kendo UI theme in your application entry point to apply the default styling:

import '@progress/kendo-theme-default/dist/all.css';

You can also try the other available Kendo UI themes.

Next Steps

The Tooltips package provides the following components:

Tooltip API

The Tooltips package requires the following peer dependencies in your application:

Package Name	Description
vue	Contains the functionality necessary to define Vue components.
@progress/kendo-vue-popup	Contains positioning logic for the Popover component.
@progress/kendo-licensing	Contains the internal infrastructure related to licensing.
@progress/kendo-svg-icons	Contains Kendo UI SVG icons.
@progress/kendo-vue-common	Contains common utilities used by Kendo UI for Vue components.