@gfazioli/mantine-spinner

Mantine Spinner Component

https://github.com/user-attachments/assets/2401bfe1-e829-4057-a654-7d0a895a9605

---

Overview

[!NOTE] Freely inspired by Matt Cannon on CodePen

This component is created on top of the Mantine library.

The component enables the creation of a captivating spinner effect, which enhances the visual dynamics of a user interface. This effect can be used to draw attention, indicate loading processes, or provide an interactive experience that engages users effectively. By implementing this spinner effect, developers can improve the overall aesthetic appeal and functionality of their applications, ensuring a more seamless and enjoyable user experience.

👉 You can find more components on the Mantine Extensions Hub library.

Installation

npm install @gfazioli/mantine-spinner

or

yarn add @gfazioli/mantine-spinner

After installation import package styles at the root of your application:

import '@gfazioli/mantine-spinner/styles.css';

Usage

import { Spinner } from '@gfazioli/mantine-spinner';

function Demo() {
  return <Spinner />;
}