---
title: "Menu Background v4 — Framer component · Best of Framer"
description: "$8.00 · Framer component · by Hasan Wali · Navigation. Two-stage fullscreen menu reveal"
canonical: "https://framer.elliotli.dev/component/menu-background-v4"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/Menu Background v4

# Menu Background v4

Two-stage fullscreen menu reveal

[View on Framer](https://framer.com/marketplace/components/menu-background-v4/?via=elliot-li)

![Menu Background v4 preview image 1](https://framer.elliotli.dev/og/component/menu-background-v4/07410d2d716cc75e/1600x1200.jpg)

## Summary

Two-stage fullscreen menu reveal

## Description

## **About this component**

Haytham Mask Menu is a **2-in-1 fullscreen navigation system for Framer**.

It includes both a customizable masked menu reveal component and a **MenuToggle code override**, giving you the full open/close interaction in one setup.

Connect your own Framer menu, apply the override to any button or frame, and the menu reveals from the center in two stages—expanding vertically first, then horizontally.

## **Features**

• 2-in-1 component + code override • Connect your own Framer menu • Fullscreen or contained layout • Adjustable reveal duration • Custom starting mask width and height • Adjustable z-index • Optional force-fill menu layout • Smooth opening, closing, and mid-animation reversal • Static Canvas preview states • No third-party packages • No global DOM searching • Marketplace-ready static rendering

## **How To Use**

Add the Mask Menu component, connect your menu, then apply the included **MenuToggle override** to your hamburger, icon, button, or frame.

The published version always starts closed, while the Canvas preview control lets you inspect Closed, Half, or Open states while designing.

**Need help?** Contact: [hasanwali6890@gmail.com](mailto:hasanwali6890@gmail.com)

## **Refund Policy**

All sales are final for this digital product. Refunds are available only for confirmed critical technical issues that prevent the component's core functionality and cannot be resolved within a reasonable timeframe.

Refunds are not provided for buyer's remorse, design preference, incorrect setup, or modifications made after purchase.

## Rank history [How rankings work →](/terms#rankings)

-   All · #10371

## Details

- **Author**: Hasan Wali
- **Price**: $8.00
- **Published**: 2026-09-10
- **Updated**: 2026-09-10
- **Added**: 2026-09-10
- **Categories**: Navigation

## More like this

-   [Reveal Navigations](/component/reveal-navigations) — Design Supply · Free — A calmer way to open your menu
-   [Collapsible Sidebar](/component/collapsible-sidebar) — Marso Angelov · $10 — Responsive Side Navigation
-   [Dial Picker](/component/dial-picker) — Tanmay Kaper · $14 — A machined dial for your projects
-   [Expanding Side Menu](/component/expanding-side-menu) — Russet Supply · $5 — Animated Framer Navigation