Component

Tabs

Switch between panels of content.

Preview

Content for tab 1.

Examples

Default

Content for tab 1.

With content

Overview content. Dashboard summary and stats.

AI Prompt

Ready to copy and paste into any AI model.

7 lines

prompt.txt

Build a shadcn/ui **Tabs** component for the **Clinic Admin** design system.

**Brand tokens:** Primary #70C4CA (teal), secondary #F3F4F6, destructive #F7A9AA, border #C4D0DB, radius 10px (default). Font: Nunito Sans for body, Nunito for headings.

**Design preview:** Replicate exactly the UI shown in the Clinic Admin docs preview for this component (same labels, structure, variants, and layout).

Return a React component with TypeScript. Use shadcn/ui **Tabs** as base, cn() + Tailwind CSS. Support variants and sizes shown in the preview.

Copy once, paste anywhere, keep consistent output.