Thanks to visit codestin.com
Credit goes to github.com

Skip to content

adityakr03/ImageCompressor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 

Repository files navigation


Image Compressor Website 📷✨

Welcome to the Image Compressor Website, a fast, privacy-friendly, and ad-free tool for compressing images directly in your browser. Built with a modern, responsive design, this tool simplifies image compression while prioritizing user privacy and convenience.


🌟 Features

  1. Efficient Image Compression

    • Uses the Canvas API to compress images locally in the browser.
    • Reduces image file sizes while maintaining quality.
  2. Detailed Compression Metrics

    • Displays both the original and compressed image sizes.
    • Calculates and shows the percentage reduction in size for easy comparison.
  3. One-Click Download

    • Provides a seamless download experience for compressed images.
  4. Privacy-Focused

    • All image processing is performed locally on your device.
    • No data is uploaded to any server, ensuring total privacy.
  5. Fully Responsive Design

    • Optimized for all screen sizes, from desktops to mobile phones.
    • Modern design with frosted glass-style cards and dark theme.
  6. Ad-Free Experience

    • No advertisements or trackers—focus entirely on your tasks.

🛠️ How It Works

  1. Upload an Image

    • Drag and drop your image or use the "Upload" button.
  2. Compression Process

    • The tool processes your image using the Canvas API.
    • Compression is optimized for a balance of quality and size reduction.
  3. View and Compare

    • Displays the original and compressed image sizes.
    • Shows the compression percentage for clarity.
  4. Download the Compressed Image

    • Click "Download" to save the compressed image instantly.

🔑 Key Benefits

  • Fast and Reliable: Processes images instantly in your browser.
  • Privacy-Friendly: No external server involvement.
  • Modern and Clean Design: Optimized UI for distraction-free usability.
  • Fully Responsive: Perfect for use on any device.

📂 Project Structure

├── index.html         # Main HTML file
├── style.css          # CSS file for styles and layout
├── script.js          # JavaScript for core functionality

🖥️ Technologies Used

  • HTML5: Provides the structure and layout.
  • CSS3: Adds styling, animations, and responsive design.
  • JavaScript: Implements image compression and interactivity.

🚀 Getting Started

  1. Clone this repository:
    git clone https://github.com/your-username/image-compressor.git
  2. Open index.html in your browser to start using the tool.
  3. Modify or enhance the project as required.

🎨 User Interface Highlights

  • Modern Dark Theme: Sleek interface with frosted glass-style design elements.
  • Smooth Animations: Subtle animations for an enhanced user experience.
  • Organized Layout: Clearly separated upload area, image details, and results.

📷 Demo

  1. Upload an image from your device.
  2. View the original size, compressed size, and compression percentage.
  3. Download the compressed image with a single click.

🛡️ Privacy Assurance

This tool prioritizes your privacy by ensuring:

  • Local Processing: All compression tasks happen directly in your browser.
  • No Data Sharing: Images are never uploaded or stored externally.

🛠️ Future Enhancements

  1. Adjustable Compression Levels

    • Provide options for custom quality settings.
  2. Multi-Image Upload

    • Enable batch processing for multiple images simultaneously.
  3. Drag-and-Drop Upload

    • Simplify the upload process with drag-and-drop functionality.

🙌 Contribution

We welcome contributions! Feel free to fork this repository and submit your ideas or improvements via pull requests.


📝 License

This project is licensed under the MIT License.


Thank you for using the Image Compressor Website! 🎉