Split Layout Dynamic Tabs

Organize complex product capabilities or service offerings with the Split-Screen Dynamic Tab Widget. This component features a modern, architectural layout that divides the screen into two functional zones: a stationary "Introduction & Navigation" panel on the left, and a dynamic "Content Display" card on the right.

Designed specifically for SaaS platforms, tech start-ups, and digital agencies, this widget solves the problem of information overload. By keeping the main headline and navigation buttons static on the left, users can rapidly toggle between different value propositions (e.g., "For Marketers," "For Developers") without losing context. The right-hand content area transitions smoothly between slides, each capable of hosting its own unique background color, headline, rich text description, and call-to-action button.

Key Features:

• Intelligent Split Layout: A stationary left column for context and navigation paired with a dynamic right column for deep-dive content.
• Dynamic JavaScript Navigation: The tab buttons are automatically generated based on the slides you add. Simply create a new "Slide," name it, and the navigation updates instantly without manual coding.
• Theme-Aware Styling: The widget supports "Dark Mode" and "Light Mode" defaults. Each content slide can have a distinct background color (e.g., Emerald Green for Developers, Violet for Product), allowing for color-coded categorization.
• Full Typography Control: Every text element—from the main H2 headline to the smallest button label—features editable font family, size, and color attributes, ensuring seamless integration with your brand's design system.
• Mobile-First Responsiveness: The split-screen layout elegantly stacks into a single vertical column on smaller devices, ensuring content remains accessible and readable on smartphones.