MokuHero

The Ultimate Luxury Hero Component MokuHero is designed for creators who want to deliver a high-end, cinematic experience right from the first scroll. With an elegant asymmetric grid and a central media container that smoothly expands as you scroll, this component brings a premium feel to any Framer project.

Key Features:

• Native Video Support: Easily upload local .mp4 or .webm files directly from the Framer canvas. No external hosting required.

• Advanced Scroll Animations: Built with Framer Motion. The central media scales and adjusts its border radius perfectly on scroll, while the floating images move smoothly in parallax.

• 100% Customizable: Change typography, font sizes (desktop & mobile independently), and gap spacing right from the properties panel.

• Fully Responsive: Seamlessly adapts to Desktop, Tablet, and Mobile views. The complex grid intelligently falls back to a clean, readable layout on smaller breakpoints.

• Lightweight & Fast: Coded in React for maximum performance without bloated overrides.

Perfect for:

• High-End Glamping & Nomadic Lifestyle brands

• Boutique Architecture & Interior Design studios

• Luxury Skincare & Wellness platforms

• Premium Portfolios

How to use: Simply drag and drop the component onto your canvas, upload your central video or image, add your 4 grid images, and customize the text. The scroll animations work out-of-the-box!