Toolbar
Beta

Spinner

The FktSpinner component provides a customizable loading indicator with configurable size, stroke width, and color themes. It's designed to give users visual feedback during loading states and async operations.

Import

import {FktSpinnerComponent} from "frakton-ng/spinner";

Size variations

Spinners with different sizes for various use cases and container sizes.

Large (72px)

Medium (48px)

Small (24px)

Large (72px)

Medium (48px)

Small (24px)

Color themes

Spinners showcasing different color themes for various semantic meanings.

Primary

Accent

Info

Success

Warning

Danger

Primary

Accent

Info

Success

Warning

Danger

Loading state

Spinner used in a typical loading state scenario with conditional display.

Data loaded successfully!
@if (isLoading()) {
Loading data...
} @else {
Data loaded successfully!
}

Custom configuration

Spinner with dynamic configuration based on different states or conditions.

Thick stroke (8px)

Thin stroke (2px)

Thick stroke (8px)

Thin stroke (2px)