Welcome to Next.js!

Get started by editing pages/index.js

This is not an official starter!

Documentation →

Find in-depth information about Next.js features and API.

Learn →

Learn about Next.js in an interactive course with quizzes!

Examples →

Discover and deploy boilerplate example Next.js projects.

Deploy →

Instantly deploy your Next.js site to a public URL with Vercel.

Animations Examples

fade-up

<div data-aos=fade-up></div>

fade-down

<div data-aos=fade-down></div>

fade-left

<div data-aos=fade-left></div>

fade-right

<div data-aos=fade-right></div>

fade-up-right

<div data-aos=fade-up-right></div>

fade-up-left

<div data-aos=fade-up-left></div>

fade-down-right

<div data-aos=fade-down-right></div>

fade-down-left

<div data-aos=fade-down-left></div>

zoom-in

<div data-aos=zoom-in></div>

zoom-in-up

<div data-aos=zoom-in-up></div>

zoom-in-down

<div data-aos=zoom-in-down></div>

zoom-in-left

<div data-aos=zoom-in-left></div>

zoom-in-right

<div data-aos=zoom-in-right></div>

zoom-out

<div data-aos=zoom-out></div>

zoom-out-up

<div data-aos=zoom-out-up></div>

zoom-out-down

<div data-aos=zoom-out-down></div>

zoom-out-left

<div data-aos=zoom-out-left></div>

zoom-out-right

<div data-aos=zoom-out-right></div>

slide-up

<div data-aos=slide-up></div>

slide-down

<div data-aos=slide-down></div>

slide-right

<div data-aos=slide-right></div>

slide-left

<div data-aos=slide-left></div>

flip-left

<div data-aos=flip-left></div>

flip-right

<div data-aos=flip-right></div>

flip-up

<div data-aos=flip-up></div>

flip-down

<div data-aos=flip-down></div>