🎯 Nexus teaches Next.js from foundations to professional systems⚡ App Router, React 19, and Tailwind v4 in one learning path🧩 Inspect real components, layouts, and reusable patterns🛠️ Build production discipline, not just polished demos📚 Tracks, references, and design studies in one place🎯 Nexus teaches Next.js from foundations to professional systems⚡ App Router, React 19, and Tailwind v4 in one learning path🧩 Inspect real components, layouts, and reusable patterns🛠️ Build production discipline, not just polished demos📚 Tracks, references, and design studies in one place🎯 Nexus teaches Next.js from foundations to professional systems⚡ App Router, React 19, and Tailwind v4 in one learning path🧩 Inspect real components, layouts, and reusable patterns🛠️ Build production discipline, not just polished demos📚 Tracks, references, and design studies in one place🎯 Nexus teaches Next.js from foundations to professional systems⚡ App Router, React 19, and Tailwind v4 in one learning path🧩 Inspect real components, layouts, and reusable patterns🛠️ Build production discipline, not just polished demos📚 Tracks, references, and design studies in one place
UI Components

Spinner

Animated SVG loading spinner with 5 sizes and custom color support.

Quick Preview

Loading…

Installation

// Copy from
src/components/ui/Spinner.tsx

Examples

All Sizes

Loading…Loading…Loading…Loading…Loading…

Brand Color

Loading…

In a Button

Prompt Preview

Copy a prompt that recreates this UI

Paste this into your AI coding assistant to generate code that closely matches the reference, including color, size, shape, typography, spacing, and polish.

Copy-ready AI prompt

Starts from the current visual reference and project constraints.

Tweak only product-specific copy or data after the first generation pass.

Props

PropTypeDefaultDescription
size'xs' | 'sm' | 'md' | 'lg' | 'xl''md'Spinner size
colorstring-Spinner color (CSS color value)
labelstring'Loading…'Accessible label for screen readers
classNamestring-Additional CSS classes