Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/vehbiu/imagex

🔄️ Convert images in the browser. No ads, no servers, no uploads, just conversion!
https://github.com/vehbiu/imagex

canvas convert converter image

Last synced: 22 days ago
JSON representation

🔄️ Convert images in the browser. No ads, no servers, no uploads, just conversion!

Host: GitHub
URL: https://github.com/vehbiu/imagex
Owner: vehbiu
Created: 2024-10-03T21:45:28.000Z (3 months ago)
Default Branch: master
Last Pushed: 2024-10-05T11:36:55.000Z (3 months ago)
Last Synced: 2024-12-15T11:34:16.313Z (23 days ago)
Topics: canvas, convert, converter, image
Language: TypeScript
Homepage: https://imagex.vehbi.me/
Size: 274 KB
Stars: 4
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# ImageX - Image Converter

![NextJs](https://img.shields.io/badge/Next-20232A?style=for-the-badge&logo=react&logoColor=61DAFB)
![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)
![TailwindCSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white)

A browser-based image converter that allows you to convert images to various formats without any ads or servers—ensuring your privacy.

## 🌟 Features

- **Multiple Format Support**: Convert images to PNG, JPEG, WebP, AVIF, BMP, and ICO.
- **Responsive Design**: Works seamlessly on all devices.
- **Privacy First**: All processing happens locally in your browser.
- **User-Friendly Interface**: Intuitive controls for file uploads, format selection, and resizing.
- **Download History**: Keep track of your recent conversions.

## 🚀 Demo

Try it out live at [imagex.vehbi.me](https://imagex.vehbi.me)

![Website Preview](https://raw.githubusercontent.com/vehbiu/imagex/refs/heads/master/.readme/preview.png)

## 🛠️ Technologies Used

- React (via NextJS)
- TypeScript
- TailwindCSS
- Lucide Icons
- FileSaver.js

## ⚙️ Installation

1. Clone the repository
```bash
git clone https://github.com/vehbiu/imagex.git
```

2. Install dependencies
```bash
bun install
```

3. Start the development server
```bash
bun run dev
```

## 📁 Project Structure
```
src/
├── components/
│ ├── ui/ # UI components
│ └── download-history.tsx # Download history component
├── app/
│ ├── page.tsx # Main conversion page
│ └── layout.tsx # Default layout
├── lib/
│ ├── types.ts # Type definitions
│ └── utils.ts # Utility functions (shadcn)
├── App.tsx # Main application component
└── ...
```

## 🎨 Customization

### Adding New Formats

To add support for a new image format, modify the format options in the `Select` component within `image-converter.tsx`:

```typescript
New Format
```
> ⚠️ Warning
Canvas does not support all image formats. Make sure to test the new format thoroughly before adding it to the list.

### Updating Styles

Modify the styles in `tailwind.config.js` to customize the appearance of the UI components.

## 📝 License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

## 🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the [issues page](https://github.com/vehbiu/imagex/issues).

## 👤 Author

**Vehbi**

- Website: [vehbi.me](https://vehbi.me)
- GitHub: [@vehbiu](https://github.com/vehbiu)

## 🙏 Acknowledgments

- Icons provided by [Lucide](https://lucide.dev/)
- File handling library: [FileSaver.js](https://github.com/eligrey/FileSaver.js/)

## 📊 Stats

![GitHub stars](https://img.shields.io/github/stars/vehbiu/imagex?style=social)
![GitHub forks](https://img.shields.io/github/forks/vehbiu/imagex?style=social)

---

Made with ❤️ by [@vehbiu](https://github.com/vehbiu)