Forge

The Page Loader component shows a loading page overlay when pressing a link or a submit button.

With this generator, you will be able to customize a CSS loader for your web page. Just select a spinner/loader and then you will have the option to customize the color, size and speed of the CSS loader.

Explore over 350+ animated loaders crafted in Outsystems, presented as reusable blocks. You can change background Color, Opacity, Loader Position, Size and Animated frequency. Stay tuned for regular updates with additional loaders and exciting new features. This reusable component is fully functions with CSS. No additional JavaScript required.

A fullscreen loading overlay with pure CSS.
User interaction is disabled when overlay is active.
Just show/hide the WB according to need to utilize in your screen.

All-purpose loader. Its size and colors can be customized.

Animated Spinners using  CSS

Tiny & beautiful site-wide progress indicator

Create an icon with a rotating spinner in the center of the screen, and create a background with a transparent background.

A button that has a loader (the same as the OutSystems Loading Button widget) and has added functionality to show a success or fail outcome depending on the outcome of the action. This button also does not resize to have a smaller if you chose to only show the loader and not the text. Also added functionality - the loading message is an expression and can thus be changed during the loading process as you wish.