ButtonsProNew
Isometric Button
A slab button in isometric view. On hover five layers fan out like a stack of cards, and pressing squeezes the stack.
Customize
color
textColor
hoverColor
hoverTextColor
Based on big-ape-36 by adamgiebl (MIT license) ยท Terms of use
Props
9 properties| Property | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | "Button" | Button label. |
| width | number | 120 | Slab width in pixels. |
| height | number | 38 | Slab height in pixels. |
| fontSize | number | 20 | Label size in pixels. |
| color | string | "#2a2a2a" | Color of the slab and its sides. |
| textColor | string | "#ffffff" | Label color at rest. |
| hoverColor | string | "#fafafa" | Color of the layers that lift off on hover. |
| hoverTextColor | string | "#0a0a0a" | Label color on hover. |
| className | string | โ | Classes for the wrapper. |
Dependencies
2 required packages
npm install clsx tailwind-merge