Getting Started
What is Aether?
Aether is a Roblox library that helps create "floating" elements such as tooltips, popovers, dropdowns and more.
Aether is a port of Floating UI, which is designed for the web. Full credit goes to the creators of Floating UI for their original implementation.
Two key features are provided:
Positioning
Aether provides many features that let you robustly anchor an absolutely-positioned floating element next to a given reference element. Here are some examples:
- A popover that floats beneath a button after being hovered, and needs to be anchored there while open.
- A dropdown that may adapt to the changes of a client's screen, such as adjusting the size and placement.
- A tooltip that must always be shifted inside the boundaries of the screen, as well as maintaining a placement.
With Aether, any floating element can be precisely positioned to stay visible and accessible.
Interactions
Floating elements often require complex interactions to ensure a smooth user experience. Aether supports this by offering built-in middleware and collision management, making it easier to handle behaviors like hovering, clicking, or dynamic repositioning.
Aether's interaction features ensure that your UI elements respond intuitively and adapt to changes in user interactions or screen layout.