{"id":13809292,"url":"https://github.com/dmitru/console-log-img","last_synced_at":"2026-05-14T19:36:15.257Z","repository":{"id":57206019,"uuid":"294813036","full_name":"dmitru/console-log-img","owner":"dmitru","description":"Print images to browser console - like console.log but for images, Canvas, ImageBitmap and more!","archived":false,"fork":false,"pushed_at":"2021-11-22T15:11:45.000Z","size":212,"stargazers_count":16,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-17T15:51:18.272Z","etag":null,"topics":["canvas","debugging","html5-canvas","imagebitmap","js","logging"],"latest_commit_sha":null,"homepage":"https://codesandbox.io/s/console-log-img-test-bti64","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/dmitru.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-09-11T21:11:25.000Z","updated_at":"2024-11-20T02:29:47.000Z","dependencies_parsed_at":"2022-09-18T06:55:52.410Z","dependency_job_id":null,"html_url":"https://github.com/dmitru/console-log-img","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dmitru%2Fconsole-log-img","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dmitru%2Fconsole-log-img/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dmitru%2Fconsole-log-img/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dmitru%2Fconsole-log-img/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dmitru","download_url":"https://codeload.github.com/dmitru/console-log-img/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254077027,"owners_count":22010643,"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":["canvas","debugging","html5-canvas","imagebitmap","js","logging"],"created_at":"2024-08-04T01:02:15.593Z","updated_at":"2026-05-14T19:36:15.228Z","avatar_url":"https://github.com/dmitru.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003ePrint Images to Browser Console from Any Source ⚡️\u003c/h1\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"MIT License\" src=\"https://img.shields.io/github/license/dmitru/console-log-img\"/\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\n\n\u003ca href=\"https://imgur.com/06122Fq\"\u003e\u003cimg src=\"https://i.imgur.com/06122Fq.gif\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n# What is it\n\nIt extends `window.console` to allow you print Canvases and images from various sources.\n\n[VIEW DEMO](https://codesandbox.io/s/console-log-img-test-bti64)\n\n### Use-cases\n\nTo help develop visual algorithms: generative design and art, image processing, etc.\n\nThis library extends the global `console` object with a new method to print an image from one of the many supported sources:\n\n```typescript\nconsole.img(\n  imgSource:\n    | string\n    | HTMLImageElement\n    | OffscreenCanvas\n    | ImageBitmap\n    | HTMLCanvasElement\n    | CanvasRenderingContext2D\n    | OffscreenCanvasRenderingContext2D\n  scale = 1,\n  printDimensions = true,\n)\n```\n\n### Features\n\n- ✅ supports many image source types: HTMLCanvasElement, OffscreenCanvas, Image elements, ImageBitmap, image URIs\n- ✅ works in WebWorkers with OffscreenCanvas\n- ✅ zero dependencies\n- ✅ it's tiny!\n- ✅ written in TypeScript\n\n# Usage\n\n```typescript\nimport { initConsoleLogImg } from 'console-log-img';\n\n// Run this once to initialize the library\ninitConsoleLogImg({\n  // Optionally, disable image dimensions logging (enabled by default)\n  printDimensions: true,\n});\n\n// ... later in the code ...\n\n// Print an image from a URI, at original size\nconsole.img('https://openclipart.org/image/800px/5661');\n\n// Print a Canvas at 30% zoom, also log canvas dimensions\nconst canvas = document.getElementById('my-canvas');\nconsole.img(canvas, 0.3, true);\n\n// Print a CanvasRenderingContext2D\nconst ctx = canvas.getContext('2d');\nconsole.img(ctx, 0.5);\n\n// Print an ImageBitmap at 100% zoom\nconst bitmap = await createImageBitmap(canvas);\nconsole.img(bitmap, 1);\n\n// Print an Image DOM element\nconst imgEl = document.getElementById('my-img');\nconsole.img(imgEl);\n```\n\n# Install\n\n```\nnpm i --save console-log-img\n```\n\nOr with Yarn:\n\n```\nyarn add console-log-img\n```\n\n# Acknowledgements \u0026 Thanks\n\n- Source code was adapted from dunxrion/console.image\n- Original created by Adrian Cooney\n\n# Used By\n\nUsing console-log-img? Open an issue to add your company or project to this list.\n\n- [Inkarnate](https://inkarnate.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdmitru%2Fconsole-log-img","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdmitru%2Fconsole-log-img","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdmitru%2Fconsole-log-img/lists"}