Orchard Features Connect Pricing
Sign in

Features

Getting started Design Backend
Components Effects
Components
Navigation
Adaptive Tab Bar Elastic Tab Bar

Adaptive Tab Bar

Web

A liquid glass tab bar that shrinks as you scroll down, then returns to full size as you scroll back up or select a tab. Your agent can add two to eight tabs with your labels and icons, size the bar for mobile or desktop, and connect each tab to your product's existing views.

Get started

How to use

  1. 1

    Connect Orchard

    Connect Orchard MCP to your coding agent once.

  2. 2

    Ask your agent

    "Add Adaptive Tab Bar to this app navigation."

    "Use Home, Search, Messages, and Profile, and connect each tab to the existing views."

    "Make the Adaptive Tab Bar respond to scrolling in this content area."

  3. 3

    Done

    Your agent connects each tab to your product's real views and keeps the adaptive scroll and elastic selection behavior intact.

Design pricing

Design is free on every plan and does not count toward metered usage.

© 2026 Orchard
PrivacyTermsContact