{"id":13446068,"url":"https://github.com/neocotic/qrious","last_synced_at":"2025-12-12T03:45:50.031Z","repository":{"id":1604140,"uuid":"2185527","full_name":"neocotic/qrious","owner":"neocotic","description":"Pure JavaScript library for QR code generation using canvas","archived":false,"fork":false,"pushed_at":"2024-06-18T16:43:55.000Z","size":1443,"stargazers_count":1572,"open_issues_count":42,"forks_count":217,"subscribers_count":34,"default_branch":"master","last_synced_at":"2025-05-08T23:16:55.864Z","etag":null,"topics":["browser","javascript","qr","qrcode","qrcode-generator"],"latest_commit_sha":null,"homepage":"https://neocotic.com/qrious","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/neocotic.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGES.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":"AUTHORS.md","dei":null,"publiccode":null,"codemeta":null}},"created_at":"2011-08-10T14:23:55.000Z","updated_at":"2025-04-20T15:42:16.000Z","dependencies_parsed_at":"2024-01-03T07:22:10.073Z","dependency_job_id":"b6b04420-0891-40c4-97bc-5e914519eee5","html_url":"https://github.com/neocotic/qrious","commit_stats":{"total_commits":106,"total_committers":6,"mean_commits":"17.666666666666668","dds":"0.10377358490566035","last_synced_commit":"881c9a7ad12a6155e15722a62706f1148afed18c"},"previous_names":["neocotic/qr.js"],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neocotic%2Fqrious","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neocotic%2Fqrious/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neocotic%2Fqrious/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neocotic%2Fqrious/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/neocotic","download_url":"https://codeload.github.com/neocotic/qrious/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254129489,"owners_count":22019628,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["browser","javascript","qr","qrcode","qrcode-generator"],"created_at":"2024-07-31T05:00:44.769Z","updated_at":"2025-12-12T03:45:44.988Z","avatar_url":"https://github.com/neocotic.png","language":"JavaScript","readme":"     .d88888b.  8888888b.  d8b\n    d88P\" \"Y88b 888   Y88b Y8P\n    888     888 888    888\n    888     888 888   d88P 888  .d88b.  888  888 .d8888b\n    888     888 8888888P\"  888 d88\"\"88b 888  888 88K\n    888 Y8b 888 888 T88b   888 888  888 888  888 \"Y8888b.\n    Y88b.Y8b88P 888  T88b  888 Y88..88P Y88b 888      X88\n     \"Y888888\"  888   T88b 888  \"Y88P\"   \"Y88888  88888P'\n           Y8b\n\n[QRious](https://github.com/neocotic/qrious) is a pure JavaScript library for generating QR codes using HTML5 canvas.\n\n[![Chat](https://img.shields.io/gitter/room/neocotic/qrious.svg?style=flat-square)](https://gitter.im/neocotic/qrious)\n[![Demo](https://img.shields.io/badge/demo-live-brightgreen.svg?style=flat-square)](https://codepen.io/neocotic/pen/YQzmBm)\n[![Dev Dependency Status](https://img.shields.io/david/dev/neocotic/qrious.svg?style=flat-square)](https://david-dm.org/neocotic/qrious?type=dev)\n[![License](https://img.shields.io/npm/l/qrious.svg?style=flat-square)](https://github.com/neocotic/qrious/blob/master/LICENSE.md)\n[![Release](https://img.shields.io/npm/v/qrious.svg?style=flat-square)](https://www.npmjs.com/package/qrious)\n\n* [Install](#install)\n* [Examples](#examples)\n* [API](#api)\n* [Migrating from older versions](#migrating-from-older-versions)\n* [Bugs](#bugs)\n* [Contributors](#contributors)\n* [License](#license)\n\n## Install\n\nInstall using the package manager for your desired environment(s):\n\n``` bash\n$ npm install --save qrious\n# OR:\n$ bower install --save qrious\n```\n\nIf you want to simply download the file to be used in the browser you can find them below:\n\n* [Development Version](https://cdnjs.cloudflare.com/ajax/libs/qrious/4.0.2/qrious.js) (71kb - [Source Map](https://cdnjs.cloudflare.com/ajax/libs/qrious/4.0.2/qrious.js.map))\n* [Production Version](https://cdnjs.cloudflare.com/ajax/libs/qrious/4.0.2/qrious.min.js) (18kb - [Source Map](https://cdnjs.cloudflare.com/ajax/libs/qrious/4.0.2/qrious.min.js.map))\n\nCheck out [node-qrious](https://github.com/neocotic/node-qrious) if you want to install it for use within\n[Node.js](https://nodejs.org).\n\n## Examples\n\n``` html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n  \u003cbody\u003e\n    \u003ccanvas id=\"qr\"\u003e\u003c/canvas\u003e\n\n    \u003cscript src=\"/path/to/qrious.js\"\u003e\u003c/script\u003e\n    \u003cscript\u003e\n      (function() {\n        var qr = new QRious({\n          element: document.getElementById('qr'),\n          value: 'https://github.com/neocotic/qrious'\n        });\n      })();\n    \u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\nOpen up `demo.html` in your browser to play around a bit.\n\n## API\n\nSimply create an instance of `QRious` and you've done most of the work. You can control many aspects of the QR code\nusing the following fields on your instance:\n\n| Field           | Type    | Description                                        | Default       | Read Only |\n| --------------- | ------- | -------------------------------------------------- | ------------- | --------- |\n| background      | String  | Background color of the QR code                    | `\"white\"`     | No        |\n| backgroundAlpha | Number  | Background alpha of the QR code                    | `1.0`         | No        |\n| element         | Element | Element to render the QR code                      | `\u003ccanvas\u003e`    | Yes       |\n| foreground      | String  | Foreground color of the QR code                    | `\"black\"`     | No        |\n| foregroundAlpha | Number  | Foreground alpha of the QR code                    | `1.0`         | No        |\n| level           | String  | Error correction level of the QR code (L, M, Q, H) | `\"L\"`         | No        |\n| mime            | String  | MIME type used to render the image for the QR code | `\"image/png\"` | No        |\n| padding         | Number  | Padding for the QR code (pixels)                   | `null` (auto) | No        |\n| size            | Number  | Size of the QR code (pixels)                       | `100`         | No        |\n| value           | String  | Value encoded within the QR code                   | `\"\"`          | No        |\n\n``` javascript\nvar qr = new QRious();\nqr.background = 'green';\nqr.backgroundAlpha = 0.8;\nqr.foreground = 'blue';\nqr.foregroundAlpha = 0.8;\nqr.level = 'H';\nqr.padding = 25;\nqr.size = 500;\nqr.value = 'https://github.com/neocotic/qrious';\n```\n\nThe QR code will automatically update when you change one of these fields, so be wary when you plan on changing lots of\nfields at the same time. You probably want to make a single call to `set(options)` instead as it will only update the QR\ncode once:\n\n``` javascript\nvar qr = new QRious();\nqr.set({\n  background: 'green',\n  backgroundAlpha: 0.8,\n  foreground: 'blue',\n  foregroundAlpha: 0.8,\n  level: 'H',\n  padding: 25,\n  size: 500,\n  value: 'https://github.com/neocotic/qrious'\n});\n```\n\nThese can also be passed as options to the constructor itself:\n\n``` javascript\nvar qr = new QRious({\n  background: 'green',\n  backgroundAlpha: 0.8,\n  foreground: 'blue',\n  foregroundAlpha: 0.8,\n  level: 'H',\n  padding: 25,\n  size: 500,\n  value: 'https://github.com/neocotic/qrious'\n});\n```\n\nYou can also pass in an `element` option to the constructor which can be used to generate the QR code using an existing\nDOM element, which is the only time that you can specify read only options. `element` must either be a `\u003ccanvas\u003e`\nelement or an `\u003cimg\u003e` element which can then be accessed via the `canvas` or `image` fields on the instance\nrespectively. An element will be created for whichever one isn't provided or for both if no `element` is specified,\nwhich means that they can be appended to the document at a later time.\n\n``` javascript\nvar qr = new QRious({\n  element: document.querySelector('canvas'),\n  value: 'https://github.com/neocotic/qrious'\n});\n\nqr.canvas.parentNode.appendChild(qr.image);\n```\n\nA reference to the `QRious` instance is also stored on both of the elements for convenience.\n\n``` javascript\nvar canvas = document.querySelector('canvas');\nvar qr = new QRious({\n  element: canvas,\n  value: 'https://github.com/neocotic/qrious'\n});\n\nqr === canvas.qrious;\n//=\u003e true\n```\n\n### `toDataURL([mime])`\n\nGenerates a base64 encoded data URI for the QR code. If you don't specify a MIME type, it will default to the one\npassed to the constructor as an option or the default value for the `mime` option.\n\n``` javascript\nvar qr = new QRious({\n  value: 'https://github.com/neocotic/qrious'\n});\n\nqr.toDataURL();\n//=\u003e \"data:image/png;base64,iVBOR...AIpqDnseH86KAAAAAElFTkSuQmCC\"\nqr.toDataURL('image/jpeg');\n//=\u003e \"data:image/jpeg;base64,/9j/...xqAqIqgKFAAAAAq3RRQAUUUUAf/Z\"\n```\n\n## Migrating from older versions\n\nIf you've been using an older major version and would like details on what's changed and information on how to migrate\nto the latest major release below:\n\nhttps://github.com/neocotic/qrious/wiki/Migrating-from-older-versions\n\n## Bugs\n\nIf you have any problems with QRious or would like to see changes currently in development you can do so\n[here](https://github.com/neocotic/nqrious/issues). Core features and issues are maintained separately\n[here](https://github.com/neocotic/qrious-core/issues).\n\n## Contributors\n\nIf you want to contribute, you're a legend! Information on how you can do so can be found in\n[CONTRIBUTING.md](https://github.com/neocotic/qrious/blob/master/CONTRIBUTING.md). We want your suggestions and pull\nrequests!\n\nA list of QRious contributors can be found in [AUTHORS.md](https://github.com/neocotic/qrious/blob/master/AUTHORS.md).\n\n## License\n\nCopyright © 2017 Alasdair Mercer  \nCopyright © 2010 Tom Zerucha\n\nSee [LICENSE.md](https://github.com/neocotic/qrious/blob/master/LICENSE.md) for more information on our GPLv3 license.\n","funding_links":[],"categories":["Libraries","JavaScript","*.js","QRCode","Open Source Project"],"sub_categories":["QR code","Browser","Markdown","Utility","JavaScript"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fneocotic%2Fqrious","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fneocotic%2Fqrious","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fneocotic%2Fqrious/lists"}