ButtonsNew
Social Tooltip Icons
Round link buttons: on hover color fills the button from the bottom up and a tooltip with the name pops up above.
Customize
fillColor
iconColor
activeIconColor
background
Based on chilly-eagle-55 by PriyanshuGupta28 (MIT license) · Terms of use
More in Pro
View allProps
8 properties| Property | Type | Default | Description |
|---|---|---|---|
| items | SocialTooltipIcon[] | — | Links: label, address, icon and an optional own color. |
| size | number | 50 | Button diameter in pixels. |
| fillColor | string | "#fafafa" | Hover fill and tooltip color. |
| iconColor | string | "#d4d4d4" | Icon color at rest. |
| activeIconColor | string | "#0a0a0a" | Icon and tooltip text color on hover. |
| background | string | "#171717" | Button background at rest. |
| newTab | boolean | true | Open links in a new tab. |
| className | string | — | Classes for the wrapper. |
Dependencies
2 required packages
npm install clsx tailwind-merge