---
title: "Helio - Hero & Menu — Framer component · Best of Framer"
description: "$16.00 · Framer component · by Berkay Erdinc · Sections. Hero, mega-menu & mobile drawer"
canonical: "https://framer.elliotli.dev/component/helio-hero-menu"
---

[Home](/)/[Components](/components)/[Sections](/components/category/sections)/Helio - Hero & Menu

# Helio - Hero & Menu

Hero, mega-menu & mobile drawer

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

![Helio - Hero & Menu preview image 1](https://framer.elliotli.dev/og/component/helio-hero-menu/5410a3239b859ca8/1600x1200.jpg)

## Summary

Hero, mega-menu & mobile drawer

## Description

Helio is a complete, production-ready hero + navigation system for Framer — not just a static section.

An animated gradient shader sets a warm, immersive backdrop while your headline, eyebrow and CTA stay razor-sharp on top. Four mega-menus open on hover with a live blur that unifies the panel with the hero behind it. On tablet and mobile, the nav collapses into a polished drawer with tap-to-expand accordions, a featured card, and full-width CTAs.

Everything runs on a clean design system — color tokens and responsive text styles — so you can re-theme the whole thing in minutes. Fully responsive across desktop, tablet and mobile. Drop it in, swap the copy, ship.

**What's inside** • Animated gradient hero (Framer native shader — no external assets) • Sticky navbar with logo, 5 links and two CTA styles • 4 hover mega-menus with live backdrop blur + spotlight cards • Mobile/tablet drawer with tap-to-expand accordions • Design-system driven — color tokens + responsive type scale • 3 breakpoints (desktop / tablet / mobile), pixel-perfect • Smooth mount, hover and reveal animations • 100% editable, no code required

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

-   All · #3240

## Details

- **Author**: Berkay Erdinc
- **Price**: $16.00
- **Published**: 2026-06-27
- **Updated**: 2026-06-27
- **Added**: 2026-06-27
- **Categories**: Sections

## More like this

-   [Project Index](/component/project-index) — Bernardo Lickfold · Free — Editorial index: hover & scroll
-   [Face Parade](/component/face-parade) — RAjan · Free — Animated team profiles
-   [Staircase Cover Flow](/component/staircase-cover-flow) — Karim Saif · $7 — editorial-inspired image gallery
-   [In Their Words](/component/in-their-words) — Majed Monem · $9 — A wall of customer quotes