Skip to content

Menu Background v3

2-in-1 folding menu reveal

Menu Background v3 preview image 1

Summary

2-in-1 folding menu reveal

Description

About this Component

Haytham Fold Menu is a 2-in-1 Framer interaction that combines a Code Component with a reusable MenuToggle Code Override. The component creates a polished two-panel menu reveal, while the override lets any Framer layer become the open/close trigger.

The menu always starts closed. On tap, both panels rotate inward from opposite sides and meet cleanly in the center. Tap again and the animation reverses smoothly back to its hidden state. Small overlap and edge-offset handling help prevent visible center seams during responsive animation.

Perfect For

Portfolio navigation, agency sites, fullscreen menus, editorial layouts, landing pages, creative overlays, and premium Framer interactions.

Key Features

• 2-in-1: Code Component + Code Override • Use any Framer layer as the trigger • Split rotational menu reveal • Smooth reversible animation • Independent left and right colors • Adjustable duration and opacity • Sharp, Smooth, and Linear easing • Starts closed by default • Responsive seam protection • Static-renderer safe • Scoped interaction behavior • Lightweight property controls

How It Works

Add the Fold Menu component to your page and size it to the area you want covered. Place your menu content above it, then apply the included MenuToggle override to any button, icon, text layer, or custom trigger. Tap once to open and again to close.

Customize the panel colors, opacity, duration, and easing directly from Framer’s property controls.

Questions? Contact: [email protected]

Refund Policy

All sales are final for this digital product. A refund is offered only for a confirmed critical technical issue that prevents the component’s core function and cannot be resolved within a reasonable timeframe. Refunds are not provided for buyer’s remorse, aesthetic preference, or modifications made after purchase. Please report technical issues with evidence within 14 days of purchase.

Rank history How rankings work →

1500110001104578/309/1610/410/2211/9
  • All · #10457

Details

More like this