# Tooltips

We used, Tooltip from vuematerial.io and customized the look of it. It's a really handy component and can be integrated very easily.




<div class="md-layout">
  <div class="md-layout-item">
    <md-button class="md-primary">
      Tooltip on top
      <md-tooltip md-direction="top">on top</md-tooltip>
    </md-button>
  </div>
  <div class="md-layout-item">
    <md-button class="md-primary">
      Tooltip on bottom
      <md-tooltip md-direction="bottom">on bottom</md-tooltip>
    </md-button>
  </div>
  <div class="md-layout-item">
    <md-button class="md-primary">
      Tooltip on right
      <md-tooltip md-direction="right">on right</md-tooltip>
    </md-button>
  </div>
  <div class="md-layout-item">
    <md-button class="md-primary">
      Tooltip on left
      <md-tooltip md-direction="left">on left</md-tooltip>
    </md-button>
  </div>
</div>

Note: for more details about the tooltip props and attributes that you can use, please see the Tooltip section from vuematerial.io