Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/solo-fox/metaverses

Metaverses - a Modern Next 13 Website With Framer Motion & Tailwind CSS.
https://github.com/solo-fox/metaverses

animation coool framer meta motion nextjs react verses

Last synced: about 1 month ago
JSON representation

Metaverses - a Modern Next 13 Website With Framer Motion & Tailwind CSS.

Awesome Lists containing this project

README

        

![Logo](screenshots/11.jpg)

# Metaverses

Metaverses - a Modern Next 13 Website With Framer Motion & Tailwind CSS

## Functionalities

👉 **Beautiful Sections**: Includes hero, services, features, how to use, roadmap, pricing, footer, and header.

👉 **Parallax Animations**: Engaging effects triggered by mouse movement and scrolling

👉 **Complex UI Geometry**: Utilizes tailwindcss for intricate shapes like circular feature displays, grid lines, and side lines.

👉 **Latest UI Trends**: Incorporates modern design elements such as bento grids.

👉 **Cool Gradients**: Enhances visuals with stylish gradients using Tailwind CSS for cards, buttons, etc.

👉 **Responsive**: Ensures seamless functionality and aesthetics across all devices

and many more, including code architecture and reusability

## Technologies Used

- **React**: Frontend framework for building dynamic and interactive user interfaces.
- **Tailwind CSS**: Utility-first CSS framework for rapid UI development and customization.
- **vite** : a build tool that aims to provide a faster and leaner development experience for modern web projects
- **framer motion** : Open source, production-ready animation and gesture library for React
## Screenshots

![Screenshot 1](screenshots/1.jpg)
![Screenshot 2](screenshots/2.jpg)
![Screenshot 3](screenshots/3.jpg)
![Screenshot 4](screenshots/4.jpg)
![Screenshot 5](screenshots/5.jpg)
![Screenshot 6](screenshots/6.jpg)
![Screenshot 7](screenshots/7.jpg)
![Screenshot 8](screenshots/8.jpg)
![Screenshot 9](screenshots/9.jpg)
![Screenshot 10](screenshots/10.jpg)
![Screenshot 11](screenshots/11.jpg)

## Getting Started

To run the project locally, follow these steps:

1. Clone the repository: `git clone `
2. Navigate to the project directory: `cd metaverses`
3. Install dependencies: `npm install`
4. Start the development server: `npm run dev`