Graphic Designer Portfolio

A modern, attractive, and fully responsive single-page portfolio website designed specifically for graphic designers. Built using Next.js, TailwindCSS, and shadcn UI components, this portfolio showcases creative work, skills, services, and contact information with smooth navigation and an elegant design.

Features

• Responsive Design: Perfectly optimized for all screen sizes — mobiles, tablets, laptops, and desktops.

• Single Page Layout: Smooth scrolling navigation across multiple sections:

  • Navbar with active link highlighting
  • Hero Section with engaging introduction and call-to-actions
  • About Section to highlight background and story
  • Feature Section to showcase skills or unique strengths
  • Portfolio Section with working tabs to filter and display projects
  • Services Section to present offered design services
  • Contact Section with a working contact form
  • Footer with social links and copyright info

• Clean and Modern UI: Utilizes TailwindCSS and shadcn UI for clean, maintainable styling.

• Interactive Tabs: Portfolio filtering tabs implemented for dynamic project display.

• Accessibility: Built with semantic HTML and keyboard navigation in mind.

• Performance Optimized: Fast loading with Next.js static generation and optimized images.

Technologies Used

• Next.js — React framework for server-side rendering and static site generation
• TailwindCSS — Utility-first CSS framework for styling
• shadcn UI — Headless UI components for React and TailwindCSS
• React — JavaScript library for building user interfaces

Installation

1. Clone the repository

git clone https://github.com/pawantech12/graphic-designer-portfolio.git
cd graphic-designer-portfolio

2. Install dependencies

pnpm install
# or
yarn install

3. Run the development server

pnpm run dev
# or
yarn dev

4. Open http://localhost:3000 in your browser to view the portfolio.

Deployment

You can deploy this portfolio easily on platforms like:

• Vercel — Recommended for Next.js apps, zero-config deployment
• Netlify
• Firebase Hosting

Build the project before deployment:

pnpm run build

Customization

• Replace placeholder text and images in the /public and /components directories with your own portfolio content.
• Update social links in the Footer component.
• Modify color schemes and styles via TailwindCSS configuration or shadcn UI component props.

Contributions

Contributions are welcome! Feel free to open an issue or submit a pull request for improvements or bug fixes.

License

This project is free to use.

Contact

Created by Pawan Kumavat — feel free to reach out via:

• Email: pawankumavat042@gmail.com
• LinkedIn: Pawan Kumavat
• Portfolio: pawan kumavat

Thank you for checking out my portfolio project!