Relative Time Card

Relative timestamps with the absolute time on hover.

Default

buena mono 1.2 published 3 days ago

<HoverCard>
  <HoverCardTrigger delay={200} render={<span />}>{formatDistanceToNow(publishedAt, { addSuffix: true })}</HoverCardTrigger>
  <HoverCardContent className="w-auto font-mono text-xs">
    <div>Local {publishedAt.toLocaleString()}</div>
    <div>UTC {publishedAt.toUTCString()}</div>
  </HoverCardContent>
</HoverCard>

Markdown for agents: /design/relative-time-card.md · spec: /design.md