Skip to content
Fieldbook
Menu
Sign in
EN

Buttons

Tilted plinth call to action

Tilted plinth call to action: A chunky call to action resting on a solid colored plinth, tilted slightly in space, that lifts off its base on hover and sinks under a press.

Using Tilted plinth call to action

Tilted plinth call to action uses the inline preview frame with a light/dark theme setting.

Customize the preview

These controls are passed to the demo. Defaults and limits describe the preview; consult the implementation for its full prop API.

ControlTypeDefaultPreview limits
labeltextJoin todayUp to 24 characters
accentcolor#FF4D8DNo additional limit in the metadata.
tiltnumber10From 0 to 20; step 1
depthnumber5From 0 to 12; step 1
showArrowbooleantrueNo additional limit in the metadata.
Which frameworks are available for Tilted plinth call to action?

Tilted plinth call to action is available for React, Vue, Svelte, Astro, HTML. The live preview uses React; the source observations below apply to index.tsx. Check the selected port before relying on the same interactions.

What does Tilted plinth call to action depend on?

The React metadata lists these npm dependencies beyond React: clsx, tailwind-merge.

What accessibility details are visible in Tilted plinth call to action?

The React source for Tilted plinth call to action includes: native elements (button); attributes and handlers (aria-hidden). These are source observations. Verify accessible names, focus order and keyboard behavior in the composed page.

How does Tilted plinth call to action handle reduced motion?

Tilted plinth call to action reads the motion preference in its React source through matchMedia(prefers-reduced-motion). Check the full implementation, shared styles and selected port with reduced motion enabled; these observations do not establish that every animation stops.

Connect your agent

Related open components

Still of the Lift and Sink Button component, a Fieldbook UI component in Buttons.
1868Lift and Sink ButtonButtonsA tinted monospace button that floats up on hover and sinks into its own inset shadow when pressed.
Still of the Press block button component, a Fieldbook UI component in Buttons.
1831Press block buttonButtonsA rounded block button resting on a solid ledge of shadow that shortens as the button travels down under a press.
Still of the Tilted deck button component, a Fieldbook UI component in Buttons.
1898Tilted deck buttonButtonsA button laid back in perspective like a key on a sloped deck, tipping further away and sliding down as it is hovered and pressed.
Still of the Bevel press pill component, a Fieldbook UI component in Buttons.
2708Bevel press pillButtonsA dark bevelled pill with a recessed round chip on its end that sinks into the surface when pressed.
Still of the Elevated chip button component, a Fieldbook UI component in Buttons.
2534Elevated chip buttonButtonsA pale rounded chip resting on stacked soft shadows that tints toward the accent on hover and sinks onto a deeper shadow with an accent outline when pressed.
Still of the Elevation ladder fill button component, a Fieldbook UI component in Buttons.
2660Elevation ladder fill buttonButtonsA capsule that climbs three elevation steps between rest, hover and press while a soft-edged accent wash crosses its face.