The Tooltip component is used to display a tooltip.

The Tooltip component can be used to display additional information when hovering an element. This component is built on top of the Radix UI library and styled using Tailwind CSS.

This component comes from the Shadcn UI Library - with minimal changes to the original component. I recommended to check out the original documentation for more information.


import { Tooltip, TooltipTrigger, TooltipContent } from '~/core/ui/Tooltip'; import { Button } from '~/core/ui/Button'; <Tooltip> <TooltipTrigger asChild> <Button variant='ghost'>Hover me</Button> </TooltipTrigger> <TooltipContent> Hello world </TooltipContent> </Tooltip>

Subscribe to our Newsletter
Get the latest updates about React, Remix, Next.js, Firebase, Supabase and Tailwind CSS