logo

8bitcn/ui

DocsComponentsBlocksThemesSponsors
Sections
  • Get Started
  • Components
  • Blocks
Authentication Blocks
  • Login Form with Icons
  • Login Form with Image
  • Login Form
  • Login Page
Calendar Blocks
  • Calendar Block
  • Range Calendar
  • Single Date Calendar
Chart Blocks
  • Step Area Chart
  • Multiple Bar Chart
  • Bar Chart
Dashboard Blocks
  • Dashboard
Gaming Blocks
  • Audio Settings
  • Chapter Intro
  • Character Sheet
  • Dialogue
  • Difficulty Select
  • Friend List
  • Game Over
  • Game Progress
  • Leaderboard
  • Loading Screen
  • Main Menu
  • Pause Menu
  • Player Profile Card
  • Quest Log
  • Save Slots
  • Victory Screen

Loading Screen

PreviousNext

Displays a retro-styled loading screen with animated progress bar and rotating tips.

LeaderboardMain Menu

On This Page

InstallationUsageExamplesAuto ProgressCustom TipsWithout PercentageCustom TitleFullscreen Mode
SponsorsSponsored by
Shadcn Blocks

Shadcn Blocks

The ultimate block set for Shadcn

Shadcn Studio

Shadcn Studio

Shadcn blocks & templates

Built by OrcDev and Contributors. The source code is available on GitHub.

8-bit Loading Screen block

Open in v0

LOADING

0%

Press any key to continue...

Installation


pnpm dlx shadcn@latest add @8bitcn/loading-screen

Usage


Examples

Auto Progress

Use autoProgress for an animated loading bar that automatically progresses from 0 to 100:

Custom Tips

Provide your own array of tips to display:

Without Percentage

Hide the percentage display:

Custom Title

Change the loading title:

Fullscreen Mode

Use the fullscreen variant for a full-page loading overlay: