QR Code is a Figma plugin for generating QR codes and inserting into Figma

Figma plugin built with Vue.js and Tailwind

Usage

In Figma select main menu -> Plugins -> QR Coder

Type in the text field to generate the QR code

Support types

• Plain text
• URLs (www.example.com)
• Email (mailto:example@gmail.com)
• Phone numbers (tel:+12125551212)

Coming soon!

• WIFI
• MECARD

Installation and build setup

The project is separated into 2 sections. The main Figma code and the UI which is based on Vue and Tailwind.

For main Figma code

# install dependencies
$ npm install

# serve in watch mode
$ npm run watch

# build for production
$ npm run build

For UI

# install dependencies
$ npm install

# serve with hot reload at localhost:8080
$ npm run serve

# build for production
$ npm run build

UI Setup

Check out instruction to setup Figma Plugin UI

Figma setup guide

You can find instructions at: https://www.figma.com/plugin-docs/setup/

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Credit

• https://github.com/kozakdenys/qr-code-styling

License

MIT