<h1 align="center"><img alt="QRBTF" src=".github/qrbtf-logo.svg" height="75"></h1>

<p align="center">
    URL: <a href="https://qrbtf.com" rel="noopener noreferrer" target="_blank">qrbtf.com</a><br />
    QRBTF is a simple web app to beautify your QR code.
</p>

<p align="center">
    <img src="public/img/QRcodes.jpg">
</p>

## Features

* Various Art QR Code Styles
* Parametric Design
* No Backend Required
* Support for SVG Downloads

中文介绍: 

* [如何制作一个漂亮的二维码](https://mp.weixin.qq.com/s/_Oy9I9FqPXhfwN9IUhf6_g)
* [QRBTF 开源啦!来写个二维码样式吧~](https://mp.weixin.qq.com/s/GFEMCWQu3e2qhTuBabnHmQ)

## QRBTF Website

### Installation

``` bash
git clone https://github.com/ciaochaos/qrbtf.git
cd qrbtf
npm install
npm start
```

### Usage

1. Open [qrbtf.com](https://qrbtf.com).
2. Enter a URL or text.
3. Select a style.
4. Adjust parameters.
5. Download `JPG` or `SVG`.

## React Component (react-qrbtf)

See [CPunisher / react-qrbtf](https://github.com/cpunisher/react-qrbtf) for more information.

``` bash
npm install react-qrbtf --save
```

### Include the Component

```js
import React from 'react'
import { QRNormal } from 'react-qrbtf'

class Component extends React.Component {

    render() {
        return (
            <QRNormal
                value="react-qrbtf"
                className="my-qrcode"
                styles={{ svg: {width: "200px"} }}
                type="round"
                size={50}
                opacity={80}
                posType="planet"
                otherColor="#33CCCC"
                posColor="#009999"
            />
        )
    }
}
```

## Third-Party Project

* [gexin1 / beautify-qrcode](https://github.com/gexin1/beautify-qrcode)

## Author

* [ciaochaos](https://github.com/ciaochaos)
* [CPunisher](https://github.com/CPunisher)

## Donation

#### Paypal

[![](https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif)](https://www.paypal.me/ciaochaos)

#### Alipay

<img align="center" src="https://blog.ciaochaos.com/projects/qrcode/alipay2.jpeg" width="250">

## Dependency

* [davidshimjs / qrcode](https://github.com/davidshimjs/qrcodejs)
* [cozmo / jsQR](https://github.com/cozmo/jsQR)

## License

[GPLv3](LICENSE)