Preloader

Full-page boot overlay. The mark draws an orbit around the logo, then fades out after window load.

Basic Usage

Drop neura::preloader near the top of <body> . It covers the viewport, then fades out after window load (plus a short minimum duration).

blade

Neura UI

Loading…

<neura::preloader
    brand="Neura"
    logoLight="https://docs.neuraui.dev/logo/light.svg"
    logoDark="https://docs.neuraui.dev/logo/dark.svg"
/>

Indicators

mark is the boot animation. Switch to an orb , a spinner , or none when the orbit is too much.

blade

Orb

Spinner

<neura::preloader indicator="orb" />
<neura::preloader indicator="spinner" spinnerVariant="ring" />
<neura::preloader indicator="none" brand="Neura" />

Manual control

Disable auto-hide and call NeuraKitPreloader.hide() when your app is ready (Livewire boot, data fetch, …).

blade

Waiting for hide()

<neura::preloader :auto-hide="false" />

<script>
    // when ready:
    NeuraKitPreloader.hide()
</script>

Props

Property	Type	Default	Description
indicator	string	mark	`mark · orb · spinner · none`
orbState	string	working	Passed to `neura::orb`
orbSize	int	72	Orb size in pixels
spinnerVariant	string	ring	Passed to `neura::spinner`
label	string	Loading…	Status text under the indicator
brand	string	null	Brand name
logo / logoLight / logoDark	string	null	Brand logos
autoHide	bool	true	Dismiss after window load
minDuration	int	400	Minimum visible time in ms
overlay	bool	true	Fixed fullscreen vs inline preview
zIndex	int	100	CSS z-index when overlay