Create Pure CSS Tooltips with Tips

Create Pure CSS Tooltips with tips, no JS is required.It works on :hover and can be positioned using helper classes and can be tweaked by using Less or Sass sources.

Example:

<a data-tip="true" data-tip-content="I'm a tooltip!" class="top"></a>

tips has 6 helper classes:

  • top: position top
  • right: position right
  • bottom: position bottom
  • left: position left
  • small: small size
  • large: large size

Preview

pure-css-tooltips