portfolio Tailwind Templates

Portfolio

This is my personal portfolio website built using Next.js, Three.js, and Tailwind CSS. It showcases my skills and projects through interactive and dynamic UI components.

My Portfolio

This is my personal portfolio website showcasing my skills, projects, and experiences. The website is built using modern web technologies such as Next.js, Three.js, and Tailwind CSS. The design incorporates dynamic and interactive UI components to create a seamless user experience.

🚀 Features

  • Spotlight Effect: Interactive lighting that follows the user's cursor, enhancing the 3D elements on the page.
  • Bentogrid Layout: A unique grid layout for better visual organization of content.
  • 3D Pin Globe: Displays my GitHub activity on an interactive 3D globe.
  • Infinite Moving Cards: A carousel of cards that dynamically moves and loops.
  • Background Gradient: Eye-catching gradients that change based on the section of the website.
  • Magic Button: A button that changes appearance and interaction on hover.
  • Moving Borders: Interactive border animations when hovering over certain sections.
  • Text Generate Effect: Dynamic text that is generated or revealed letter by letter.
  • Canvas Reveal Effect: A 3D canvas animation that is revealed on scrolling.

🛠️ Technologies Used

  • Next.js: For server-side rendering and static site generation.
  • Three.js: For 3D rendering and animations.
  • Tailwind CSS: For utility-first CSS styling.
  • Framer Motion: For smooth animations.
  • GitHub API: To fetch and display dynamic content related to GitHub activity.

💻 Installation & Setup

To get started locally, follow these instructions:

  1. Clone the repository:

    git clone https://github.com/abbasmithaiwala/portfolio.git
    
  2. Navigate to the project directory:

    cd portfolio
    
  3. Install Dependencies:

    npm install
    
  4. Run the development server:

    npm run dev
    
  5. Open http://localhost:3000 in your browser to view the project.

🌐 Live Demo

You can check out the live version of the portfolio here.

📝 License

This project is open-source and available under the MIT License.

Top categories

Loading Svelte Themes