Skip to content

Latest commit

 

History

History
65 lines (41 loc) · 2.58 KB

README.md

File metadata and controls

65 lines (41 loc) · 2.58 KB

Webfolio

Welcome to Webfolio! This template is a modern, responsive digital resume and portfolio website designed to showcase your professional experience, skills, and personal information.

Features

  • Responsive Design: Adapts to various screen sizes for optimal viewing on desktop, tablet, and mobile devices.
  • Dark Mode: Easily toggle between light and dark themes for a personalized experience.
  • Social Media Integration: Quick access to your social profiles.
  • Progress Bars: Visually represent your skill levels with customizable progress bars.
  • Downloadable Resume: Include a link for visitors to download your resume.

File Structure

/Webfolio
├── index.html
├── styles.css
└── toggle.js

index.html

The main HTML file that structures your portfolio. Customize your personal details, skills, projects, education, and contact information within this file.

styles.css

The stylesheet that defines the look and feel of your portfolio. Adjust colors, fonts, and layouts according to your preferences.

toggle.js

The JavaScript file that implements the light/dark mode toggle functionality.

Getting Started

  1. Clone the Repository: Download or clone the repository to your local machine.

    git clone https://github.com/aashnajoshi/webfolio.git

  2. Open index.html: Use your preferred web browser to open the index.html file.

  3. Customize Content: Replace placeholder content with your information:

    • Update your name, position, personal info, skills, and projects.
    • Change social media links to your profiles.
    • Adjust the resume download link.

  4. Style Adjustments: Modify styles.css to change the aesthetic of your portfolio. Feel free to experiment with different color schemes and fonts.

  5. Toggle Functionality: The dark mode toggle is preconfigured. You can adjust the toggling functionality in toggle.js if needed.

Customization Tips

  • Profile Image: Replace the image URL in the <img> tag to your preferred profile picture.
  • Skill Levels: Adjust the width of the .progress divs in the skills section to represent your proficiency accurately (e.g., width: 80% for a skill at 80%).
  • Education and Projects: Add or remove entries to fit your background in the education and projects sections.

Browser Compatibility

This template is designed to work in modern browsers (Chrome, Firefox, Safari, Edge). Ensure that your visitors have an updated browser for the best experience.

Credits

Inspired by RWD_Resume.