Buttons

Two face flip button

A button with two stacked faces that rotate past each other in 3D on hover, the front tipping away toward a chosen edge while the back swings in to take its place.

Using Two face flip button

A button with two stacked faces that rotate past each other in 3D on hover, the front tipping away toward a chosen edge while the back swings in to take its place.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: frontLabel, backLabel, from, accent, tapScale

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

1633Flip face buttonButtonsA button with two faces that trades one for the other on a three dimensional turn, reversing from wherever it is when the pointer leaves.

2687Hinged plate buttonButtonsTwo identical label plates sit exactly on top of each other and swing apart on hover, like a pair of doors turning under perspective.

2767Extruded tilt buttonButtonsA heavy display button leaning in perspective whose hollow letters are extruded by two hard offsets that flip sides as the plate swings on hover and slap flat when pressed.

2360Gradient flip uppercase buttonButtonsAn uppercase button filled with a two tone diagonal ramp that swaps end for end on hover, taking its tinted cast shadow along with it.

2688Hinged progress buttonButtonsA button whose face hinges backward on hover, exposing a tray where a progress bar fills in uneven bursts and fades out at full width.

1867Isometric Stack ButtonButtonsA button drawn in isometric projection that fans into a stack of parallel copies on hover and compresses again when pressed.