Welcome toUI Showcase
A comprehensive collection of production-ready UI components. Built with Next.js, TypeScript, Tailwind CSS v4, and Framer Motion. All components are fully responsive, support dark mode, and are ready to copy into your projects.
Basic Components
Essential building blocks for any application
Buttons
Interactive button components with various styles, sizes, and states
- Primary
- Secondary
- Outline
- Ghost
- Link
- Destructive
Cards
Flexible card layouts for content organization and display
- Basic Cards
- With Images
- With Actions
- Stats Cards
Forms
Form inputs, validation patterns, and user input components
- Text Inputs
- Selects
- Checkboxes
- Radio Groups
- Validation
Data Tables
Sortable, filterable data tables for displaying structured data
- Basic Tables
- Sortable Columns
- Actions
- Status Badges
Pattern Components
Production-ready sections for your website
Hero Sections
Production-ready hero designs for landing pages
- Travel
- SaaS
- E-commerce
- Portfolio
- Agency
- Fintech
Auth Pages
Authentication flows and login/signup forms
- Login
- Signup
- Social Login
- 2FA
- Forgot Password
- Onboarding
Pricing
Conversion-optimized pricing layouts
- Simple
- Comparison
- Toggle
- Tiered
- Freemium
- Enterprise
Feature Sections
Feature showcase layouts for product pages
- Card Grid
- Image Features
- Bento
- Timeline
- Stats
- Testimonials
Timelines
Timeline and roadmap components
- Vertical
- Horizontal
- Roadmap
- Progress
- History
- Events
Footers
Footer section layouts for websites
- Multi-Column
- Minimal
- Newsletter
- Social
- Mega
- Centered
CTA Sections
Call-to-action sections for conversions
- Hero CTA
- Minimal
- Split
- Banner
- Card
- Social Proof
Newsletters
Newsletter signup forms
- Inline
- Centered
- Side Image
- Minimal
- Popup
- Social Proof
Navigation
Navbar and menu components
- Simple
- Mega Menu
- Sidebar
- Transparent
- Search
- Multi-Level
Stats & Metrics
Statistics and metrics displays
- Simple
- Animated Counter
- Progress Bar
- Comparison
- Charts
Blog Grids
Blog and content grid layouts
- Classic
- Featured
- Masonry
- Minimal
- Image-First
- Timeline
Ready to build something amazing?
Start exploring our collection of components and patterns. Copy, customize, and use them in your next project. All components are production-ready and fully customizable.