Back to top

A floating scroll-to-top button.

The button is position: fixed and reveals itself once you scroll past the threshold (300px by default). Scroll down to see the live one appear in the bottom-right corner. The cards below show the available styles.

import { BuiBackToTop } from 'ng-blatui';

<bui-back-to-top [threshold]="300" />

Subtle

<!-- variant="subtle" for a muted, bordered button -->
<bui-back-to-top [threshold]="300" variant="subtle" />

Keep scrolling — the live back-to-top button stays pinned to the bottom-right corner.

API reference

Inputs

Prop	Type	Default	Description
`threshold`	`number`	`300`	Pixel scroll distance before the button appears.
`variant`	`"primary" \| "subtle"`	`'primary'`	Visual style of the button.
`label`	`string`	—	Accessible label for the button; falls back to the i18n default.

Every ng-blatui component also accepts a class input to merge extra Tailwind classes onto the host.