Powerful positioning primitives.

Floating UI is a low-level toolkit to position floating elements while intelligently keeping them in view. Tooltips, popovers, dropdowns, menus, and more.


Places your floating element on 12 core positions.

Click the dots


Shifts your floating element to keep it in view.

Scroll the container


Changes the placement of your floating element to keep it in view.

Scroll the container


Changes the size of your floating element to keep it in view.

Scroll the container


Dynamically positions an arrow element that is center-aware.

Scroll the container


Position relative to any coordinates, such as your mouse cursor.

Move your mouse

Light as a feather.

The core is only 600 bytes when minified and compressed with Brotli. Plus, the architecture is super modular, so tree-shaking works like a charm.

computePosition()0.6 kB
shift()+0.6 kB
limitShift()+0.2 kB
flip()+0.5 kB
hide()+0.2 kB
offset()+0.1 kB
autoPlacement()+0.4 kB
size()+0.3 kB
inline()+0.6 kB
DOM platform+1.9 kB

Support Floating UI's future.

Ongoing work is making Floating UI the best, 100% free solution in this space. We are proudly sponsored by the following organizations, consider joining them on Open Collective!


User onboarding and product adoption made simple

Modern Treasury

The one place to keep a business’s money flowing

Mobile Mall - Mobile Phone Prices in PakistanCoupontoaster - Discount and Coupon CodesCell Tracking Apps - Parental Control Software Review Websitewazirx referral code


The ability to easily craft beautiful and accessible tooltips, popovers, dropdowns, and more is in development.


A floating element to describe or add additional information to another element, such as a button.

Hover, tap, or focus


An interactive menu of selectable items and potential submenus.

Click to open


A floating element displaying rich, optionally interactive HTML content.

Click to open

Coming soon

The @floating-ui/components package is in development. Consider supporting the future of this project through sponsorship:


Ready to install?

Start playing via your package manager or CDN.

Package Manager

Install with npm, Yarn, or pnpm.

Get started


Install with the unpkg or Skypack CDN.

Get started