Silicon UI Kit

##### Menu

Preview Docs

### Content

Typography Icon font Code Images & figures Tables

### Components

Accordion Alerts Audio player Badges Blog components Breadcrumb Buttons Button group Cards Carousel (Slider) Collapse Dropdowns Forms Gallery (Lightbox) Image comparison slider Input group List group Modal Navbar Offcanvas Pagination Parallax Pills Placeholders Popovers Portfolio components Pricing Progress bars Social buttons Spinners Steps Tabs Team Testimonials / reviews Toasts Tooltips Video popup

### Utilities

Bootstrap Silicon

# Tooltips

Custom tooltips for local title storage.

Bootstrap docs

## Static example

Tooltip on the top
Tooltip on the right
Tooltip on the bottom
Tooltip on the left
Tooltip with HTML

## Live demo

    <!-- Tooltip on top -->
    <button class="btn btn-outline-secondary" type="button" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">Tooltip on top</button>

    <!-- Tooltip on right -->
    <button class="btn btn-outline-secondary" type="button" data-bs-toggle="tooltip" data-bs-placement="right" title="Tooltip on right">Tooltip on right</button>

    <!-- Tooltip on bottom -->
    <button class="btn btn-outline-secondary" type="button" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

    <!-- Tooltip on left -->
    <button class="btn btn-outline-secondary" type="button" data-bs-toggle="tooltip" data-bs-placement="left" title="Tooltip on left">Tooltip on left</button>

    <!-- Tooltip with HTML -->
    <button class="btn btn-outline-secondary" type="button" data-bs-toggle="tooltip" data-bs-placement="top" data-html="true" title="<i>Tooltip</i> <u>with</u> <strong>HTML</strong>">Tooltip with HTML</button>

Top