未ログイン状態で閲覧中
  • 投稿日:2026/04/09
  • 更新日:2026/04/10
Canvaいらず?クロコちゃんで背景透過・文字消しアプリを作ってみた

Canvaいらず?クロコちゃんで背景透過・文字消しアプリを作ってみた

Nao@あなたの夢を叶えるFP

Nao@あなたの夢を叶えるFP

この記事は約5分で読めます
要約
Claude Codeに適当にお願いするだけで、背景透過・テキスト消去の画像加工ツールが作れました!プログラミング知識ゼロでOK。 実際のプロンプトと使い方をスクショ付きで紹介します。どちらも無料で試せます❗ Canvaに課金してない方はぜひ✨️


1. はじめに

こんにちは❗ Naoです。フリーランスのFPとITコンサルをやっています✨️


突然ですが、こんな場面、面倒じゃないですか?


🌀 AIで作った画像のテキストや透かしを消したい

🌀 画像の背景を削除して透明にしたい

🌀 Canvaやフォトショを開くのが面倒で、サクッと画像を加工したい

🌀 有料ツールにお金をかけたくない

そんな方のために、今回はクロコちゃん(Claude Code / Cowork)を使ってブラウザだけで動く画像加工ツールを実際に作ってみた体験をご紹介します!

指示はものすごく簡単な日本語だけ。
プログラミングの知識はまったく不要です👍️

コピペでできますので、ぜひ試してみてくださいね。


2. 作ったもの①:背景透過ツール

JPEGやPNGの画像をアップロードするだけで、背景を自動で取り除いて透過PNGに変換してくれるツールです。260409_透過・テキスト消しClaude Code (1).png⭕️ ドラッグ&ドロップで画像をアップロード
⭕️ AIが自動で被写体と背景を判別
⭕️ 透過PNGをそのままダウンロード
⭕️ データは一切外部送信なし(ブラウザ内だけで処理)

3. 作ったもの②:テキスト消去ツール

画像内の消したい部分をブラシで塗ると、その部分のテキストや文字を周囲の色となじむように自然に消去してくれるツールです。260409_透過・テキスト消しClaude Code (4).png⭕️ 消したい範囲をブラシで自由に塗れる
⭕️ ブラシサイズを調整可能
⭕️ Undo(元に戻す)機能つき
⭕️ インペインティング技術で周囲と自然になじむ
⭕️ 結果が気に入らなければマスクを修正して再処理できる

💡ワンポイント💡

「インペインティング」とは、画像の欠損部分を周囲のピクセルから推測して補完する技術です。

OpenCVという画像処理ライブラリのTelea法を使っています。グラデーションや模様の背景でも、かなり自然に仕上がりますよ✨️


4. プロンプトはたったこれだけ!

ここが一番伝えたい部分です❗

実際にClaude Codeに送ったプロンプトはこちら。


背景透過ツールのとき:

🧑🏻「jpegやpngの画像を受け取ったら、背景だけを透過PNGにするアプリ作れる?」


テキスト消去ツールのとき:

🧑🏻「画像から指定した範囲のテキストだけを消すこともできる?テキストが消えた部分は周囲の色と自然になじむようにしたい。」


これだけです😆

Claude Codeが不明点を整理してくれて、計画を立てて、コードを書いて、動作確認まで全部やってくれました。

私はOKかどうかを判断するだけ。

追加でお願いしたのは

「起動するためのショートカットをデスクトップに作っておいてほしい」「Netlifyに公開して」くらいです笑


5. 実際の使い方(スクショ付き)

5.1. 背景透過ツールの使い方

✅️① ツールにアクセスする → https://nao-bg-remover.netlify.app を開く

✅️② 画像をアップロードする → 画面中央のエリアにJPEG/PNGをドラッグ&ドロップ(またはクリックして選択)3.png✅③ 処理完了を待つ → AIモデルが自動で背景を除去します(初回のみ少し時間がかかります)

✅️④ 「透過PNGをダウンロード」ボタンを押すだけ!4.png

5.2. テキスト消去ツールの使い方

✅️① ツールにアクセスする → https://nao-text-eraser.netlify.app を開く

✅️② 画像をアップロードする → ドラッグ&ドロップで画像を読み込む5.png✅️③ 消したい部分を赤く塗る → ブラシで消したいテキストの上をなぞる(赤いマスクが表示される)

✅️④「テキストを消去」ボタンを押す 6.png

✅️⑤ 結果を確認してダウンロード → Before/Afterを並べて確認できます。気に入らなければ「マスクを修正する」で塗り直しもできます。7.png

💡ワンポイント💡

ブラシサイズはスライダーで調整できます。
細かい文字は小さめ、大きなロゴは大きめに設定するときれいに消えます!

なおこれは私の指示ではなく、クロコちゃんが気を利かせて作ってくれた機能です笑

6. 試してみよう(無料公開中)

両方のツールをNetlifyで無料公開しています!

アカウント登録不要・完全無料でお使いいただけます。


⭕️ 【背景透過ツール】 https://nao-bg-remover.netlify.app

⭕️ 【テキスト消去ツール】 https://nao-text-eraser.netlify.app


💡ワンポイント💡

どちらのツールも画像データは一切サーバーに送信されません。すべての処理がお使いのブラウザ内で完結するので、プライバシーの心配もなし。

仕事の資料や個人の写真でも安心してお使いいただけます✨️


7. おわりに

いかがでしたでしょうか?

Claude Codeに日本語で話しかけるだけで、実用的な画像加工ツールが2つも出来上がってしまいました!


✅️ ブラウザだけで背景透過PNGを作れる

✅️ 画像内のテキストを自然に消去できる

✅️ どちらも無料・データ送信なし・アカウント不要で使える

✅️ Claude Codeがあれば自分専用のツールを自分で作れる


「プログラミングができなくても、Claude Codeを使えばこんなことが実現できるんだ」と感じていただけたらと思います😊

本記事が、皆様のAI活用の参考になれば嬉しいです❗


クロコちゃん活用事例

生活をラクにしたい方へ

超簡単!スマホで見られる持ち物リストを作ろう!【Claude Code/Cowork】

【コピペでOK!】マネフォMEからスプシに自動転記する方法【Claude Code/Cowork】

【コピペでOK】乗り換えを自動検索してスケジュールに転送する方法


仕事・副業に使いたい方へ

Claude Codeに複数のGoogleアカウントを連携する方法

Canvaいらず?クロコちゃんで背景透過・文字消しアプリを作ってみた

クロコちゃんに指示するだけで領収書を自動アップロードする方法

ブックマークに追加した記事は、ブックマーク一覧ページで確認することができます。
あとから読み返したい時に便利です。

Nao@あなたの夢を叶えるFP

投稿者情報

Nao@あなたの夢を叶えるFP

トラ会員

この記事に、いいねを送ろう! 参考になった記事に、
気軽にいいねを送れるようになりました!
この記事のレビュー(9
  • 会員ID:4DpkHwJD
    会員ID:4DpkHwJD
    2026/04/10

    凄いですね。 私も試してみます。 もしかしたらcanvaいらずになるかもですね😊✨

  • 会員ID:tZ6XtRLA
    会員ID:tZ6XtRLA
    2026/04/10

    これは面白い!かゆいところに手が届くような素晴らしい使い方だと思います😃 早速使わせて頂きます!

  • 会員ID:KzYEm7l6
    会員ID:KzYEm7l6
    2026/04/09

    めちゃくちゃ助かりました!活用させていただきます🙏

    Nao@あなたの夢を叶えるFP

    投稿者

    2026/04/10

    レビューありがとうございます! これが一言でできちゃうんだから凄いですよね✨️ ぜひぜひご活用頂ければ🙏

    Nao@あなたの夢を叶えるFP

    投稿者