Content Tabs Pro for HubSpot

Polished tabbed content with horizontal, vertical, and pill-style tabs. Embed HubSpot forms in any tab. Auto-converts to accordion on mobile. Deep-linking, WCAG-accessible keyboard navigation, zero jQuery, 50+ style controls.

Demo 1

Horizontal Tabs — Interior Design Studio

Dark luxury aesthetic with left-aligned underline tabs, gold #d4a853 accent, and editorial content. Cormorant Garamond + DM Sans. No content area background or border — content flows cleanly beneath the tab bar. Includes images, video embed, table, and blockquote.

Atelier

Where vision meets craft

We design interiors that transcend trends — spaces rooted in materiality, proportion, and the way light moves through a room.

Design as Experience

Interior design living space with warm tones

We believe great interiors are not decorated — they are composed. Every material, every proportion, every negative space serves a purpose. Our philosophy is grounded in three principles:

  • Materiality First — We begin with tactile qualities. The grain of walnut, the weight of linen, the warmth of brushed brass. Materials set the emotional tone before a single piece of furniture is placed.
  • Light as Architecture — Natural and artificial light are designed together. We map sun paths, specify dimming curves, and position fixtures to sculpt atmosphere throughout the day.
  • Restraint Over Excess — We edit relentlessly. The mark of a refined space is not what was added, but what was removed. Every object earns its place.

A room should feel inevitable — as though it could not have been designed any other way.

View Our Portfolio →

Demo 2

Pill Tabs — SaaS Product

Modern light theme with centered pill tabs, indigo accent, and a bordered content card. Inter font throughout. Features overview, step-by-step guide, and pricing comparison table with CTA button.

Platform

Ship faster with less friction

Powerful features, intuitive integrations, and transparent pricing. Built for teams that refuse to compromise.

Built for Speed

Modern workspace with clean design

Every feature is designed to remove friction from your workflow. No bloat, no gates on essentials — just the tools your team actually needs to move fast.

  • Visual Workflow Builder — Drag-and-drop automation with branching logic, conditions, and 40+ action types. Zero code required.
  • Real-Time Analytics — Live dashboards with custom metrics, anomaly detection, and automated alerting via Slack or email.
  • Team Workspaces — Shared environments with role-based permissions, audit logs, and inline commenting on every workflow.
  • API-First Architecture — Full REST API with webhooks, SDKs for Python, Node, and Go, plus a GraphQL endpoint for complex queries.
  • SOC 2 Type II Certified — Enterprise-grade security with SSO, SCIM provisioning, and encryption at rest and in transit.

Demo 3

Vertical Tabs — Law Firm Practice Areas

Warm professional aesthetic with sidebar vertical tabs, navy headings, deep burgundy left-border indicator, and ivory background. Libre Baskerville + Source Sans 3. Five practice areas with detailed descriptions, images, and blockquotes. A completely different color accent from Demo 1's gold.

Practice Areas

Counsel grounded in experience

For over four decades, our attorneys have guided businesses and individuals through the most consequential legal matters they face.

Corporate Law and Governance

Corporate boardroom setting

Our corporate practice advises businesses of every scale — from emerging startups to publicly traded enterprises — on the legal structures that support sustainable growth.

  • Entity Formation — LLC, C-Corp, S-Corp, LP, and partnership structures tailored to tax efficiency and liability protection
  • Mergers and Acquisitions — Due diligence, deal structuring, regulatory filings, and post-closing integration
  • Corporate Governance — Board advisory, shareholder agreements, fiduciary duty compliance, and annual meeting protocols
  • Securities Compliance — SEC reporting, Regulation D offerings, blue sky filings, and insider trading policies
  • Joint Ventures — Cross-border partnership agreements, IP licensing, and profit-sharing frameworks

Their corporate team handled our Series B and subsequent acquisition with the kind of precision and calm that let us focus entirely on running the business.


Demo 4

Stretched Tabs — Product Feature Showcase

Clean, refined product layout with full-width stretched tabs, deep violet accent, and a soft violet content card. Outfit + Inter fonts. Product overview with image, feature bullet list, integration grid, and 3-column pricing comparison table with CTA.

Product

Build workflows that scale

A modern automation platform designed for growing teams. Connect your tools, automate processes, and focus on what matters.

Modern product dashboard interface

What is FlowKit?

FlowKit is a lightweight automation platform that connects your existing tools and eliminates repetitive work. Designed for teams of 5 to 500, it sits between your CRM, support desk, and internal tools — orchestrating data and actions without the overhead of enterprise platforms.

Unlike legacy automation tools, FlowKit was built API-first with a visual builder that non-technical team members can use immediately. No code required for 90% of use cases, full SDK access for the other 10%.

  • Visual workflow builder with drag-and-drop logic, branching, and conditions
  • 200+ native integrations including HubSpot, Salesforce, Slack, Stripe, and Notion
  • Real-time execution logs with error alerts and one-click replay
  • SOC 2 Type II certified with SSO, SCIM, and encryption at rest

Demo 5

Horizontal Tabs — Creative Agency Case Study

Minimal editorial aesthetic with centered tabs, warm red accent underline, and clean white background. Space Grotesk + DM Sans. Case study narrative with stats grid, video embed, and a premium styled mock contact form in the final tab.

Case Study

Rebranding Vellum Coffee Co.

How we transformed a regional roaster into a nationally recognized brand through strategy, identity design, and a multi-channel launch campaign.

Starting Point

Creative workspace with design materials

Vellum Coffee Co. had spent twelve years building a loyal local following in Portland. Their product was exceptional — single-origin, direct-trade, roasted in small batches. But their brand told none of that story.

They came to us with three challenges:

  • Undifferentiated identity — Their logo, packaging, and website looked interchangeable with a dozen competitors. Nothing communicated their craft or values.
  • E-commerce readiness — They had never sold direct-to-consumer online. Their digital presence was a single-page site with no commerce capability.
  • National ambition — They wanted to expand into wholesale partnerships with premium grocers and hotels, which required a brand that could compete at that level.

The brief was clear: make the outside match the inside. Build a brand worthy of the coffee.


Documentation

Module Guide

Tab Styles

Choose from three tab styles, each with its own character:


Rich Content Support

Each tab supports full rich text content including:


Form Support

Embed HubSpot forms inside any tab using the rich text editor or the form field. Forms inherit the module's configurable form styles, so they match your design without custom CSS.

19 Form Styling Controls

All form elements are fully configurable from the module's style panel:

This makes it easy to embed contact forms, lead gen forms, scheduling forms, or application forms in any tab — and have them match your brand perfectly without writing a single line of CSS.


Mobile Accordion

When enabled, the tab bar and panels are replaced with an accordion layout below the mobile breakpoint. Each tab becomes a collapsible section with smooth height animation. Only one section is open at a time.


Deep Linking

When enabled, switching tabs updates the URL with a ?tab=slug parameter. Share links that open directly to a specific tab. The slug is auto-generated from the tab label.

Example: yoursite.com/page?tab=pricing opens the “Pricing” tab directly.


Accessibility


Style Controls (50+)


Demo Notes