Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/ismail-mouyahada/master-qr-code-generator

This project is a simple QR code generator built with HTML, CSS (Tailwind CSS), and JavaScript (jQuery). It allows users to input text or a URL and select the size of the QR code to be generated. The generated QR code can be downloaded as an image.
https://github.com/ismail-mouyahada/master-qr-code-generator

api javascript qrcode-generator

Last synced: 3 days ago
JSON representation

This project is a simple QR code generator built with HTML, CSS (Tailwind CSS), and JavaScript (jQuery). It allows users to input text or a URL and select the size of the QR code to be generated. The generated QR code can be downloaded as an image.

Awesome Lists containing this project

README

        

# QR-Code Generator

![alt text](screencapture-special-space-chainsaw-q69p57pgx6w39g5v-5500-app-github-dev-app-QR-code-html-2024-05-30-20_17_37.png)

This project is a simple QR code generator built with HTML, CSS (Tailwind CSS), and JavaScript (jQuery). It allows users to input text or a URL and select the size of the QR code to be generated. The generated QR code can be downloaded as an image.

## Features

- Generate QR codes from text or URLs.
- Select from multiple QR code sizes.
- Display the generated QR code on the web page.
- Download the generated QR code as an image.

## Technologies Used

- HTML
- CSS (Tailwind CSS)
- JavaScript (jQuery)

## Getting Started

Follow these steps to get a copy of the project up and running on your local machine.

### Prerequisites

- Web browser
- Internet connection

### Installation

1. Clone the repository:

```sh
git clone https://github.com/your-username/qr-code-generator.git
```

2. Navigate to the project directory:

```sh
cd qr-code-generator
```

3. Open `index.html` in your web browser.

## Usage

1. Open the `index.html` file in your preferred web browser.
2. Enter the text or URL you want to encode in the "Data to Encode" field.
3. Select the desired QR code size from the "Select Size" dropdown.
4. Click the "Generate" button to generate the QR code.
5. The generated QR code will be displayed on the page.
6. Click the "Télécharger QR Code" button to download the generated QR code image.

## Customization

### Changing Button Colors

To change the button colors, update the classes in the HTML file. For example, to change to a different color: