OnlineFreeTools.org
  • ホーム
  • Image editing tools
    • 文字透かしを追加 — ブラウザ完結
    • 画像から色を抽出 — パレットとクリック取色
    • 画像を反転 — 左右・上下
    • 画像に枠を追加 — 色と幅
    • 画像圧縮 — 長辺・画質・目標サイズ（端末内）
    • 画像の切り抜きとサイズ変更（端末内）
    • 写真の EXIF 表示と削除（GPS・カメラ情報・端末内）
    • 画像フォーマット変換 — PNG JPEG WebP AVIF BMP GIF ICO SVG ローカル
    • グレースケール変換 — ローカルで白黒に
    • 画像結合 — 複数写真を1枚のコラージュに
    • 画像最適化 — WebP / AVIF / MozJPEG（端末内）
    • 画像に重ねる — 写真へロゴを配置
    • 画像↔Base64 — ブラウザで変換
    • 画像からGIF — 短いアニメ
    • 画像をPDFに — 1枚1ページ
    • 画像をPowerPointに — 1枚1スライド
    • 画像をWordに — ローカルDOCX
  • デザインツール
    • ブランドカラートークン — HEX/HSL/OKLCHスケール
    • WCAGコントラストチェッカー — AA/AAA比率
  • Developer tools
    • DNS に WWW を追加 — A/CNAME と各社ガイド
    • CSV と JSON を相互変換 — 型・区切り文字・ローカル
    • HTML エンティティ エンコード／デコード — ローカル処理
    • IndexNow — Bing URL 送信・キー確認・ステータスコード
    • 自分のIPアドレス確認 — グローバルIP表示（IPv4/IPv6）
    • JSON Schema バリデータ — draft-07 のパス、ローカル
    • Markdown と HTML を相互変換（プレビュー付き）
    • Compare Two Texts Online — Text Diff Checker
    • サイトのHTTPヘッダを確認 — レスポンスヘッダ検査
    • YAML と JSON を相互変換（型ルール・複数ドキュメント対応）
  • Calculators
    • BMI計算ツール — 体格指数の求め方
    • 多変数の勾配 ∇f を計算 — 偏導関数ベクトル
    • 限界収入の求め方 — MR計算ツール（公式 ΔTR / ΔQ）
    • パーセント変化の計算 — 旧値から新値への増減率
    • ROI（投資利益率）計算ツール — 計算式と例
    • 平方フィート⇔平方メートル換算 — 物件・リフォーム向け
  • English
  • 中文
  • Español
  • العربية
  • Português
  • Bahasa Indonesia
  • Français
  • 日本語
  • Русский
  • Deutsch

ツール

文字透かしを追加 — ブラウザ完結DNS に WWW を追加 — A/CNAME と各社ガイドブランドカラートークン — HEX/HSL/OKLCHスケール画像から色を抽出 — パレットとクリック取色CSV と JSON を相互変換 — 型・区切り文字・ローカル画像を反転 — 左右・上下BMI計算ツール — 体格指数の求め方多変数の勾配 ∇f を計算 — 偏導関数ベクトル限界収入の求め方 — MR計算ツール（公式 ΔTR / ΔQ）パーセント変化の計算 — 旧値から新値への増減率ROI（投資利益率）計算ツール — 計算式と例HTML エンティティ エンコード／デコード — ローカル処理画像に枠を追加 — 色と幅画像圧縮 — 長辺・画質・目標サイズ（端末内）画像の切り抜きとサイズ変更（端末内）写真の EXIF 表示と削除（GPS・カメラ情報・端末内）画像フォーマット変換 — PNG JPEG WebP AVIF BMP GIF ICO SVG ローカルグレースケール変換 — ローカルで白黒に画像結合 — 複数写真を1枚のコラージュに画像最適化 — WebP / AVIF / MozJPEG（端末内）画像に重ねる — 写真へロゴを配置画像↔Base64 — ブラウザで変換画像からGIF — 短いアニメ画像をPDFに — 1枚1ページ画像をPowerPointに — 1枚1スライド画像をWordに — ローカルDOCXIndexNow — Bing URL 送信・キー確認・ステータスコード自分のIPアドレス確認 — グローバルIP表示（IPv4/IPv6）JSON Schema バリデータ — draft-07 のパス、ローカルMarkdown と HTML を相互変換（プレビュー付き）平方フィート⇔平方メートル換算 — 物件・リフォーム向けCompare Two Texts Online — Text Diff CheckerWCAGコントラストチェッカー — AA/AAA比率サイトのHTTPヘッダを確認 — レスポンスヘッダ検査YAML と JSON を相互変換（型ルール・複数ドキュメント対応）

画像に枠を追加 — 色と幅

px

手順: ファイルを選び設定して書き出す。例: 色塊サンプルで確認。プロセスはブラウザ内のみでサーバー非送信。内容: outer colored border by width/color without cropping。目安 25MB/8192px。

使い方

Pick a photo, choose border width and color, apply, download.

ルール

Output size = original + 2×border on each axis. Content is not cropped.

  • Border is outside the original pixels.
  • Width is in pixels of the source.
  • JPEG export can use a separate flatten color if needed.
  • Huge edges may warn above ~8192 px.

例

Sample loads with a default 24px border in a contrasting color.

向いている用途

  • Social posts that need a clean frame.
  • Print white margins.
  • Unify a gallery with the same border color.

Frequently asked questions

Uploaded?

No.

Does it crop?

No—the canvas grows outward.

Units?

Width is in pixels.

Rounded corners?

This version draws a rectangular border only.

Transparent source?

PNG/WebP keep alpha inside the photo area; border fill is opaque.

Related tools

  • グレースケール変換 — ローカルで白黒に
  • 画像を反転 — 左右・上下
  • 文字透かしを追加 — ブラウザ完結

このツールを共有

SNSで共有、リンクをコピー、または端末の共有機能を使えます。

XFacebookLinkedInRedditWhatsAppTelegram

https://onlinefreetools.org/ja/tools/image-border

お問い合わせ・フィードバック

分かりにくい点、不具合、不足があれば下にメッセージを書いてください。ツールに関する内容はすべて確認します。

メール: dailyonetools@outlook.com

References

  • MDN — CanvasRenderingContext2D.fillRect()
  • MDN — CanvasRenderingContext2D.strokeRect()
  • MDN — CanvasRenderingContext2D.drawImage()
OnlineFreeTools.org · 学習プロジェクト · 継続的にイテレーション
について·開発ログ·プライバシー·利用規約·お問い合わせ