Animated Tabs

A tabs component with smooth sliding indicator animations and multiple variants.

Open in v0

Last updated: January 29, 2026

Installation

pnpm dlx shadcn add @smoothui/animated-tabs
npx shadcn@latest add @smoothui/animated-tabs
yarn dlx shadcn add @smoothui/animated-tabs
bunx shadcn add @smoothui/animated-tabs

Features

  • Three variants: underline, pill, and segment
  • Smooth sliding indicator animation
  • Controlled and uncontrolled modes
  • Support for icons in tabs
  • Full keyboard navigation
  • Accessible with proper ARIA attributes
  • Respects reduced motion preferences

Props

Animated Progress Bar

A progress bar component with smooth animations and customizable styling.

Animated Toggle

A toggle switch component with smooth animations and multiple variants including morph and icon transitions.

On this page

Installation
Features
Props

Created by

Edu Calvo's avatar
Edu Calvo

Powered by

motion.dev