CF Stack
Demo
Home
Todos
Query Demo
API Demo
KV Demo
R2 Demo
Validation Demo
Toggle theme
Sign In
CF Stack Demo
Next.js + Tailwind CSS + shadcn/ui + Lucide Icons + Framer Motion
Cloudflare Pages
Next.js 15
React 19
Tailwind CSS
Utility-first CSS framework with dark mode support
v4
CSS Variables
shadcn/ui
Beautifully designed components built on Radix UI
Components
Accessible
Framer Motion
Production-ready motion library for React
Animations
Performance
TanStack Query
Powerful data fetching, caching, and synchronization
v5
Server State
View Demo
CF Stack API
Full-stack demo with your local Hono API on Cloudflare Workers
Hono
Cloudflare Workers
TypeScript
View Demo
R2 Storage
Upload and manage images with Cloudflare R2 object storage
R2
Object Storage
File Upload
View Demo
Interactive Components
Buttons
Different button variants and states
Default
Secondary
Outline
Ghost
Small
Large
Disabled
Input Field
Form input with proper styling
Avatar
User profile images and fallbacks
CN
JD
Badges
Status indicators and labels
Default
Secondary
Outline
Destructive
Lucide Icons
Heart
Star
Zap