Hero video dialog

A hero section with a video dialog to introduce or demo your product.

Use template

Author

Magic UI

Stack

Introduction

This template adds the Magic UI Hero Video Dialog component to your project or creates a new project using Next.js if none is found in the current directory.

It comes fully integrated with Croct, giving you CMS, AB testing, and personalization out of the box.

Usage

To create a new project using this template, run:

npx croct@latest use magic-ui://component/hero-video-dialog

You can customize the template by specifying options:

npx croct@latest use magic-ui://component/hero-video-dialog --router=page

Options

The following options are available for this template:

Option	Description	Required	Default
projectName	The name of the project.	No	my-app
version	The Next.js version to use.	No	latest
router	The router to use (app or page).	No	app

Other templates from

Magic UI

Marquee

An infinite scrolling component for displaying testimonials, or user reviews.

Globe

A 3D globe to visualize global presence, activity, or reach.

Orbiting circles

Animated circles orbiting a central element to represent relationships or connections.

Bento grid

A modular grid layout for featuring content blocks, use cases, or product highlights.

Start building in seconds

Paste the following command in your terminal and let the CLI do the rest.

npx croct@latest init