{"id":17936678,"url":"https://github.com/mustafaer/ngx-qrcode-generator","last_synced_at":"2026-02-24T03:05:47.482Z","repository":{"id":162921599,"uuid":"638174709","full_name":"mustafaer/ngx-qrcode-generator","owner":"mustafaer","description":null,"archived":false,"fork":false,"pushed_at":"2024-10-23T11:29:41.000Z","size":445,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-16T12:37:31.545Z","etag":null,"topics":["angular","code","generator","qr"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/ngx-qrcode-generator","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mustafaer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-05-09T08:35:08.000Z","updated_at":"2025-01-07T08:30:09.000Z","dependencies_parsed_at":null,"dependency_job_id":"63ac0da0-d2bd-43ac-a028-e73f5475e25d","html_url":"https://github.com/mustafaer/ngx-qrcode-generator","commit_stats":{"total_commits":7,"total_committers":2,"mean_commits":3.5,"dds":0.1428571428571429,"last_synced_commit":"bba648b6a18f6afef158e0c52f267a14718a589b"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafaer%2Fngx-qrcode-generator","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafaer%2Fngx-qrcode-generator/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafaer%2Fngx-qrcode-generator/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafaer%2Fngx-qrcode-generator/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mustafaer","download_url":"https://codeload.github.com/mustafaer/ngx-qrcode-generator/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245227412,"owners_count":20580873,"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":["angular","code","generator","qr"],"created_at":"2024-10-28T22:01:38.185Z","updated_at":"2026-02-24T03:05:42.443Z","avatar_url":"https://github.com/mustafaer.png","language":"TypeScript","funding_links":[],"categories":["Third Party Components"],"sub_categories":["QR Codes"],"readme":"# NgxQrcodeGeneratorComponent\n\nThis is an Angular component that generates QR codes using the QRious library.\n\n## Installation\n\nTo use this component, follow these steps:\n\n1. Install the NgxQrcodeGeneratorComponent library by running the following command:\n\n   ```shell\n   npm i ngx-qrcode-generator\n   ```\n\n2. Import the `NgxQrcodeGeneratorComponent` into your Angular module:\n\n   ```typescript\n   import { NgxQrcodeGeneratorComponent } from 'ngx-qrcode-generator';\n\n   @NgModule({\n     declarations: [NgxQrcodeGeneratorComponent],\n     // ...\n   })\n   export class YourModule { }\n   ```\n\n3. Use the component in your Angular template:\n\n   ```html\n   \u003cngx-qrcode-generator\n     [background]=\"'white'\"\n     [backgroundAlpha]=\"1.0\"\n     [foreground]=\"'black'\"\n     [foregroundAlpha]=\"1.0\"\n     [level]=\"'L'\"\n     [mime]=\"'image/png'\"\n     [padding]=\"null\"\n     [size]=\"100\"\n     [value]=\"'your-QR-code-value'\"\n     [canvas]=\"false\"\n   \u003e\u003c/ngx-qrcode-generator\u003e\n   ```\n\n## Usage\n\nThe `NgxQrcodeGeneratorComponent` has the following input properties:\n\n- `background` (string, default: `'white'`): The background color of the QR code.\n- `backgroundAlpha` (number, default: `1.0`): The opacity of the background color (0.0 to 1.0).\n- `foreground` (string, default: `'black'`): The foreground color of the QR code.\n- `foregroundAlpha` (number, default: `1.0`): The opacity of the foreground color (0.0 to 1.0).\n- `level` (string, default: `'L'`): The error correction level of the QR code (`'L'`, `'M'`, `'Q'`, `'H'`).\n- `mime` (string, default: `'image/png'`): The MIME type of the generated QR code image.\n- `padding` (number or null, default: `null`): The padding around the QR code image (in pixels). Use `null` for default padding.\n- `size` (number, default: `100`): The size of the QR code image (width and height).\n- `value` (string): The value to encode as a QR code.\n- `canvas` (boolean, default: `false`): Whether to render the QR code as a canvas element (`true`) or an image element (`false`).\n\n## Example\n\nHere is an example of using the `NgxQrcodeGeneratorComponent`:\n\n```html\n\u003cngx-qrcode-generator\n  [value]=\"'https://example.com'\"\n  [size]=\"200\"\n  [foreground]=\"'#ff0000'\"\n  [background]=\"'#ffffff'\"\n\u003e\u003c/ngx-qrcode-generator\u003e\n```\n\nIn this example, a QR code is generated with the value `'https://example.com'`, size of `200` pixels, red foreground color (`'#ff0000'`), and white background color (`'#ffffff'`).\n\n## Notes\n\n- This component requires the QRious library to be installed.\n- Make sure to import and declare the component in your Angular module.\n- Customize the input properties to achieve the desired QR code appearance.\n- The generated QR code can be rendered as either a canvas or an image element, depending on the `canvas` input property.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmustafaer%2Fngx-qrcode-generator","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmustafaer%2Fngx-qrcode-generator","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmustafaer%2Fngx-qrcode-generator/lists"}