Flutter Tooltip

In Flutter, Tooltip widget is a material design tooltip used to let user know about the functionality of a button or UI action.

When a widget is equipped with tooltip, if user long presses the widget or some appropriate action on the widget, tooltip appears as a floating label.

Tooltip is usually used to increase the accessibility of your application, providing text based clues for visual based widgets.

Example – Flutter Tooltip

To provide tooltip for a button, surround the button with Tooltip.

In this example application, we take a FlatButton with Icon as child, i.e., a visual object. We shall surround this button with Tooltip. So, if you long press on this button, you will see a label with the message provided for Tooltip widget.


import 'package:flutter/material.dart';

void main() {

class MyApp extends StatefulWidget {
  _MyAppState createState() => _MyAppState();

class _MyAppState extends State<MyApp> {
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text('Flutter Tooltip - tutorialkart.com'),
          body: Center(
              child: Column(children: <Widget>[
              margin: EdgeInsets.all(10),
              child: Tooltip(
                message: 'My Account',
                child: FlatButton(
                  child: Icon(
                    size: 50,

Long press on the icon to show tooltip.

Flutter Tooltip


In this Flutter Tutorial, we learned how to use Flutter Tooltip widget to provide accessibility to widgets.