Tooltips

Note: when using tooltips out side of clearkit React components, the consuming application must handle their positioning. clearkit React components use floating-ui to handle their positioning.

Top

Top aligned
Top start aligned
Top end aligned
Top aligned with more than just a line of text that forces the tooltip across multiple lines

Top on Hover/Focus

Top aligned
Top start aligned
Top end aligned
Top aligned with more than just a line of text that forces the tooltip across multiple lines

Bottom

Bottom aligned
Bottom start aligned
Bottom end aligned
Bottom aligned with more than just a line of text that forces the tooltip across multiple lines

Bottom on Hover/Focus

Bottom aligned
Bottom start aligned
Bottom end aligned
Bottom aligned with more than just a line of text that forces the tooltip across multiple lines

Nav Tooltips

Standard Nav Item

Home

X Nav Item

Home