Tip

tooltip or a hint when hovering over an element

Props

content

The tooltip content inside the drop.

node
"Additional info"
<Box>...</Box>

dropProps

Any valid Drop prop to style the Tip drop container.

object
{ trapFocus: "false" }

plain

Whether content should have default styling from tip.content.

boolean
true
false

Theme

tip.content

Any valid Box property for the Tip container. Not applicable when using Tip plain prop.

object
{ 
  background: "background-contrast", 
  elevation: "small", 
  margin: "xsmall", 
  pad: { vertical: "xsmall", horizontal: "small" }, 
  round: "small"
}

tip.drop

Any valid Drop property for the Tip.

object
{
  align: { top: "bottom" }, 
  background: "none",
  elevation: "none",
  margin: "none"
}