Floating UI

Floating UI is a comprehensive JavaScript library designed to manage the positioning of floating elements such as tooltips, popovers, dropdowns, and more. It offers advanced features like smart anchor positioning, which ensures floating elements stay in view by avoiding collisions, flipping placement, or resizing as needed. The library supports various placement strategies, including shifting, flipping, and sizing, to optimize the display of floating components relative to reference elements.

Additionally, Floating UI provides a base UI built on a headless React component library, facilitating the creation of accessible and customizable floating components like tooltips, popovers, menus, dialogs, and toasts. Its interactions for React enable developers to craft complex floating behaviors, such as searchable comboboxes and action menus, with ease.

The library is platform-agnostic and supports bundling with modern frameworks like React, Vue, and React Native, as well as <canvas> elements. Its modular design ensures a small footprint, with each feature optimized for minimal size. Floating UI is open source, free to use, and actively maintained, with support from various organizations. Installation is straightforward via package managers or CDN, making it accessible for projects of all sizes.