logo

8bitcn/ui

DocsComponentsBlocksThemesSponsors
Sections
  • Get Started
  • Components
  • Blocks
Advanced
  • Demo Shell
  • Metrics Dashboard
  • Newsletter
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
CTA
  • Comparison
  • Use Cases
Dashboard Blocks
  • Dashboard
FAQ
  • Accordion
  • Card Grid
  • Searchable
Features
  • Card Grid
  • List
  • Carousel
Game
  • Boss Fight CTA
  • Checkpoint FAQ
  • Skill Tree
  • Health Bar Hero
  • XP Milestone Hero
  • Quest Roadmap
  • Party Grid
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
Hero
  • Centered
  • Split
  • Game Title
Layout
  • Footer
  • 404 Page
  • 404 Dwarf
Pricing
  • Tier Cards
  • Monthly Toggle
Social Proof
  • Stats Bar
  • Testimonials
  • Review Carousel
Team
  • Team Grid
  • Changelog
  • Case Studies
Timeline
  • Vertical
  • Horizontal
  • Zigzag Roadmap

Game Title

PreviousNext

A game-style title screen hero with stat cards and blinking "Press Start" text.

SplitLayout

On This Page

With CTA buttonsInstallationUsageProps
SponsorsSponsored by
Shadcn Blocks

Shadcn Blocks

The ultimate block set for Shadcn

Shadcn Studio

Shadcn Studio

Shadcn blocks & templates

Shadcn UI Kit

Shadcn UI Kit

Admin dashboards, blocks, components & examples

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

Hero 3 — Game Title Screen

Open in v0
EST. 2026

8BITCN

A retro component library that brings the golden age of gaming to modern web development.

50+COMPONENTS
1.7KGITHUB STARS
100+CONTRIBUTORS
PRESS START

With CTA buttons

Hero 3 — With Actions

Open in v0
CHAPTER IV

DUNGEON QUEST

Enter the dark realm. Defeat the bosses. Claim the loot.

64LEVELS
12BOSSES
200+ITEMS

Installation


pnpm dlx shadcn@latest add @8bitcn/hero3

Usage


When no actions are passed, a blinking "PRESS START" text appears automatically.

Props

PropTypeDefaultDescription
titlestringrequiredBig game-style title
subtitlestring—Badge above title (e.g., "EST. 2024", "CHAPTER IV")
descriptionstring—Body text below title
statsHeroStat[]3 defaultsStat cards below description
actionsHeroAction[][]CTA buttons (replaces "PRESS START" when provided)
childrenReactNode—Extra content
classNamestring—Additional classes