Nyx UI

Hero Section 10

A full-screen hero with a breathing animated radial-gradient background, staggered entrance, and pill CTAs.

Say hello to

Your ideas,
in full colour
File 1
File 2
File 3

A gentle, breathing gradient that calms the eye and lifts the layout. No config, no noise just a canvas that feels alive.

Hero Section 10 is a full screen hero over a breathing radial gradient background: the glow expands and contracts slowly while the headline, sub copy, and pill CTAs stagger in on load. Copy and CTA links are props. Built with Framer Motion and React. A calm, modern opening screen for products that want atmosphere rather than a busy illustration.

Installation

Install dependencies.

Copy and paste the following code into your project.

Unlock the full library

Get all pro blocks, components & illustrations, and production-ready Next.js + Tailwind templates.

Get All Access

Update the import paths to match your project setup.