ai-agent

img-clipping: Mobile Image Cropping

Name: img-clipping: Mobile Image Cropping
Author: Bless-L

Crop images on mobile with img-clipping, a JavaScript tool for founders, using canvas.

From the repo · “基于Canvas的一个h5移动端图片裁剪demo”

81 stars30 forksJavaScriptGuide quality 8/10 · reviewed Jul 26Updated 12/20/2016100% free · open source

What it does

img-clipping is a JavaScript tool that allows founders to crop images on mobile devices using canvas.

When to use it

•When you need to build a mobile application that requires image editing capabilities
•When you want to provide users with a simple way to crop and customize images on their mobile devices
•When you require a lightweight and easy-to-integrate image cropping solution for your web application

Ready-to-paste prompt

Open the index.html file in a browser and try cropping an image by selecting a region and then clicking the 'Crop' button

Heads up: Make sure your mobile device or browser supports the HTML5 canvas element, as img-clipping relies on this technology to function correctly

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/img-clipping && curl -fsSL https://workflowstacks.com/api/skills/img-clipping/claude-skill -o ~/.claude/skills/img-clipping/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How img-clipping: Mobile Image Cropping works

Codeflow

Free to inspect

Img-clipping: Mobile Image Cropping is a tiny JavaScript project (~350 lines across 6 code files). Setup is light: install Node.js, run one command. Last commit 120 months ago, no license file, no tests found.

Size

Tiny codebase

~350 lines · 6 code files · 3 min skim

Setup

Light setup

Install Node.js, run one command.

Runs on

Node.js

No API keys detected

JavaScript 67%Vue 30%HTML 3%

Where to start reading

1
README.md
Start here — what it does and how to install it
2
src/main.js
Where the program starts running
3
package.json
Dependencies and the commands it exposes
4
src/App.vue
Inside src/ — the main logic begins here

What's in each folder

src/Core code — the actual logic4 files

server/Backend / API1 files

post_pic/Folder1 files

READMENo tests foundThin docsNo CINo licenseLast update 120 mo ago

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/img-clipping && curl -fsSL https://workflowstacks.com/api/skills/img-clipping/claude-skill -o ~/.claude/skills/img-clipping/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

Bless-L

Language

JavaScript