Animated CSS tooltips to copy

Tooltips that do more than appear: one bounces in, one has a gradient, one follows the mouse, one waits and blurs in, one orbits the element, one shows a keyboard shortcut, one shows a preview, one is split in two, one ripples like a wave, one slides in elastically from the side, one reports a status, one types its text, one stacks several hints and one asks for confirmation.

They are meant for icon buttons, truncated text and settings that need a word of explanation. Set colour and timing live and copy the HTML and CSS.