{"id":34662582,"url":"https://github.com/mwdchang/image-util","last_synced_at":"2026-03-12T22:32:35.334Z","repository":{"id":42573199,"uuid":"278866660","full_name":"mwdchang/image-util","owner":"mwdchang","description":"Javascript image manipulation utilities","archived":false,"fork":false,"pushed_at":"2026-01-23T00:50:17.000Z","size":4463,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2026-01-23T17:48:21.317Z","etag":null,"topics":["image-effects","image-filters"],"latest_commit_sha":null,"homepage":"https://mwdchang.github.io/image-util","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mwdchang.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2020-07-11T13:26:16.000Z","updated_at":"2026-01-23T00:50:14.000Z","dependencies_parsed_at":"2024-08-25T05:50:10.018Z","dependency_job_id":null,"html_url":"https://github.com/mwdchang/image-util","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mwdchang/image-util","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mwdchang%2Fimage-util","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mwdchang%2Fimage-util/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mwdchang%2Fimage-util/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mwdchang%2Fimage-util/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mwdchang","download_url":"https://codeload.github.com/mwdchang/image-util/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mwdchang%2Fimage-util/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30446445,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-12T21:31:01.033Z","status":"ssl_error","status_checked_at":"2026-03-12T21:30:43.161Z","response_time":114,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["image-effects","image-filters"],"created_at":"2025-12-24T18:54:43.858Z","updated_at":"2026-03-12T22:32:35.327Z","avatar_url":"https://github.com/mwdchang.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# image-util\nA collection of composable Javscript image manipulation utilties and effects filters.\n\n\n![preview](preview.png)\n\n\n## Usage example\nQuickstart\n\n```html\n\u003cscript type=\"module\"\u003e\nimport * as ImageUtil from \"https://cdn.jsdelivr.net/gh/mwdchang/image-util@latest/dist/index.js\"\n\n// Load image\nconst img = await ImageUtil.loadImage('https://picsum.photos/300', { width: 300, height: 300 });\ndocument.body.append(ImageUtil.createCanvas(img));\n\n// Filter\nconst painterly = ImageUtil.painterlyFilter(img, 4, 10);\ndocument.body.append(ImageUtil.createCanvas(painterly));\n\n// Using web-worker\nconst worker = ImageUtil.newWorker();\n(async () =\u003e {\n  const sepiaImage = await worker.sepiaFilter(img);\n  document.body.append(ImageUtil.createCanvas(sepiaImage));\n})();\n\n\n\u003c/script\u003e\n```\n\nComposing filters, using matrix-mult, glow, and blur to simulate a nightvision filter\n```js\nconst nightVision = ImageUtil.uniformBlur(\n  ImageUtil.glowFilter(\n    ImageUtil.nightVisionFilter(img)\n  ), 6\n);\ndocument.body.append(ImageUtil.createCanvas(nightVision));\n```\n\n\n## Build library\nThe final files are under `build/dist/*`\n```\nnpm run build\n```\n\n## Run Examples\nRuns on http://localhost:8090\n```\nnpm run develop\n```\n\n## Filters and effects\n\n### Color Matrix Effects\n3x3 color matrix transformations\n\n- **Sepia**: Applies a sepia tone to the image.\n- **Polaroid**: Simulates the look of a Polaroid picture.\n- **Technicolor**: Mimics the Technicolor film effect.\n- **Kodak Chrome**: Simulates the look of Kodak Chrome film.\n- **Browni**: Applies a brownish tone to the image.\n- **Vintage**: Gives the image a vintage look.\n- **Night Vision**: Simulates a night vision effect.\n\n### Convolutional Effects\nConvolution related effects\n\n- **Blur**: Applies a simple box blur to the image.\n- **Gaussian Blur**: Applies a Gaussian blur to the image.\n- **Edge Detection**: Detects the edges in the image.\n\n### Pixel Transformation Effects\nThese filters manipulate the individual pixels of the image.\n\n- **Greyscale**: Converts the image to greyscale.\n- **Invert**: Inverts the colors of theimage.\n- **Color Splash**: Converts the image to greyscale except for a selected color.\n\n### Geometric Transformation Effects\nDistortions\n\n- **Fisheye**: Creates a fisheye lens effect.\n- **Shear**: Shears the image.\n\n### Stylistic Effects\nComplex filters that produce a specific artistic style.\n\n- **Dodge**: Creates a dodge effect.\n- **Glow**: Adds a glow effect to the image.\n- **Halftone**: Creates a halftone pattern effect.\n- **Hatch**: Creates a hatching effect.\n- **Painterly**: Creates a painterly effect.\n- **Sketch**: Creates a sketch effect.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmwdchang%2Fimage-util","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmwdchang%2Fimage-util","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmwdchang%2Fimage-util/lists"}