Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mohammedjawwad/brainwave
Brainwave is a modern UI/UX website built with React.js and Tailwind CSS, featuring sleek design, dynamic animations, and responsive layouts. It serves as a benchmark for modern web applications, showcasing cutting-edge UI trends and reusable code architecture.
https://github.com/mohammedjawwad/brainwave
bento-grid bentobox modern-ui parallax-effect reactjs tailwindcss vite
Last synced: about 1 month ago
JSON representation
Brainwave is a modern UI/UX website built with React.js and Tailwind CSS, featuring sleek design, dynamic animations, and responsive layouts. It serves as a benchmark for modern web applications, showcasing cutting-edge UI trends and reusable code architecture.
- Host: GitHub
- URL: https://github.com/mohammedjawwad/brainwave
- Owner: MohammedJawwad
- License: mit
- Created: 2024-11-16T00:01:35.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-12-09T09:23:26.000Z (2 months ago)
- Last Synced: 2025-01-17T21:06:33.023Z (about 1 month ago)
- Topics: bento-grid, bentobox, modern-ui, parallax-effect, reactjs, tailwindcss, vite
- Language: JavaScript
- Homepage: https://brainwave-js.netlify.app/
- Size: 11.8 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Brainwave 🌐
**Brainwave** is a modern UI/UX website designed with **React.js** and **Tailwind CSS**, showcasing cutting-edge design principles. Its sleek interface, seamless animations, and exceptional user experience make it a benchmark for modern web applications.
## 🌐 Demo
Experience the live demo here: [Brainwave Live Demo](https://brainwave-js.netlify.app/)
## ⚙️ Tech Stack
- **Vite**: Lightning-fast build tool for modern web development
- **React.js**: A declarative, component-based JavaScript library for building user interfaces
- **Tailwind CSS**: A utility-first CSS framework for fast and responsive design
---
## 🔋 Features
### ✨ Stunning Design
- **Hero Section**: Captivating first impression
- **Services & Features**: Highlights offerings in an intuitive layout
- **How to Use & Roadmap**: Guides users and provides a timeline
- **Pricing**: Comprehensive plans for potential users
- **Footer & Header**: Clean, functional navigation and contact options
### 🚀 Dynamic Animations
- **Parallax Effects**: Engaging mouse and scroll-triggered animations
- **Modern UI Trends**: Inspired by bento grids and sleek geometries
### 🎨 Enhanced Visuals
- **Complex UI Geometry**: Features circular displays, grid lines, and creative sidebars
- **Gradients**: Beautiful gradients for cards, buttons, and sections
### 🌟 Fully Responsive
- Optimized for all screen sizes and devices
### ♻️ Code Excellence
- Clean architecture for scalability
- Highly reusable components
---
## 🤸 Quick Start
Follow these steps to set up Brainwave locally:
### Prerequisites
Ensure the following are installed on your machine:
- **Git**
- **Node.js**
- **npm**
### Installation
1. Clone the repository:
```bash
git clone https://github.com/MohammedJawwad/Brainwave.git
cd Brainwave
```
2. Install dependencies:
```bash
npm install
```
3. Start the development server:
```bash
npm run dev
```
## 📂 Project Structure
brainwave/
├── public/ # Static assets
├── src/
│ ├── components/ # Reusable UI components
│ ├── pages/ # Main website pages
│ ├── styles/ # Tailwind CSS configurations
│ └── App.jsx # Root React component
└── vite.config.js # Vite configuration
## 📄 License
This project is licensed under the [MIT License](./LICENSE).