Places your floating element relative to another element.
Shifts your floating element to keep it in view.
Changes the placement of your floating element to keep it in view.
Changes the size of your floating element to keep it in view.
Dynamically positions an arrow element that is center-aware.
Anchor relative to any coordinates, such as your mouse cursor.
Light as a feather.
This positioning toolkit has a platform-agnostic 0.6 kB core (minified + Brotli compressed), with official bindings for the web, React DOM, React Native, and Vue.
Each module is fully tree-shakeable by your bundler:
DOM platform+2.5 kB
Interactions for React.
In addition to positioning, there are also interaction primitives to build floating UI components with React. This includes event hooks for hover, focus or click, modal and non-modal focus management, keyboard list navigation, typeahead, portals, backdrop overlays, screen reader support, and more.Use Floating UI with React
Support Floating UI!
Floating UI is free and open source, proudly sponsored by the following organizations — consider joining them on Open Collective.
User onboarding and product adoption made simple
The one place to keep a business’s money flowing