Uilora
Uilora.
Uilora
Uilora.
Content Blocks
Playground

Interactive Tabs

Interactive tabbed feature section with smooth transitions.

featuretabsinteractivetransitions

Props

Customize the component with these props

PropertyTypeDefaultDescription
tabs
Array<{id: number, label: string, icon: LucideIcon | React.ComponentType, color: string}>[]Array of tab items with id, label, icon, and color.
content
Array<{title: string, desc: string, img: string}>[]Array of content items with title, description, and image URL.
backgroundColor
string#ffffffBackground color (hex, rgb, or hsl).
title
stringEverything you need to ship faster.Section title text.
activeTabBgColor
string#f8fafcActive tab background color.
activeTabScale
number1.05Scale factor for active tab.
activeBarColor
string#0f172aActive tab indicator bar color.
tabLabelColor
string#64748bTab label text color.
activeTabLabelColor
string#0f172aActive tab label text color.
cardBgColor
string#f1f5f9Card background color.
cardBorderColor
string#e2e8f0Card border color.
cardTitleColor
string#0f172aCard title text color.
cardDescColor
string#475569Card description text color.
Interactive Tabs - Content Blocks Component | UILora