Files
SnapOtter/apps/docs/ja/tools/image/beautify.md
T
SnapOtterandGitHub 4963ab3bbd feat(docs-i18n): translate all documentation into 20 languages
All 181 docs markdown files translated into 20 languages (apps/docs/<locale>/**). Companion to the i18n code PR; admin-merged because the file count exceeds GitHub's per-PR CI trigger limit. Validated by pnpm i18n:check (all surfaces, 0 stale/missing) and a clean all-locale docs build.
2026-07-11 13:52:47 +08:00

5.5 KiB
Raw Blame History

description, i18n_source_hash, i18n_provenance, i18n_output_hash
description i18n_source_hash i18n_provenance i18n_output_hash
プレーンなスクリーンショットを、グラデーション背景、デバイスフレーム、シャドウ、SNS 向けサイズで洗練された画像に仕上げます。 8fd8a930a45e human 6b0a1b465ae7

Beautify Screenshot

スクリーンショットにグラデーション背景、デバイスフレーム、シャドウ、ウォーターマーク、SNS 向けサイズを追加します。プロダクトマーケティング、SNS、ドキュメント向けに洗練された画像を作成するのに最適です。

API Endpoint

POST /api/v1/tools/image/beautify

Parameters

Parameter Type Required Default Description
backgroundType string No "linear-gradient" 背景の種類: solidlinear-gradientradial-gradientimagetransparent
backgroundColor string No "#667eea" 単色の背景色 (backgroundTypesolid の場合に使用)
gradientStops array No [{"color":"#667eea","position":0},{"color":"#764ba2","position":100}] グラデーションのカラーストップ (最小 2)。各ストップは color (16 進) と position (0 100) を持ちます。
gradientAngle number No 135 グラデーションの角度 (度) (0 ~ 360)
padding number No 64 画像周辺のパディング (ピクセル) (0 ~ 256)
borderRadius number No 12 スクリーンショットの角の丸み (0 ~ 64)
shadowPreset string No "subtle" シャドウプリセット: nonesubtlemediumdramaticcustom
shadowBlur number No 20 カスタムシャドウのぼかし半径 (0 ~ 100、shadowPresetcustom の場合に使用)
shadowOffsetX number No 0 カスタムシャドウの水平オフセット (-50 ~ 50)
shadowOffsetY number No 10 カスタムシャドウの垂直オフセット (-50 ~ 50)
shadowColor string No "#000000" カスタムシャドウの色 (16 進)
shadowOpacity number No 30 カスタムシャドウの不透明度 (0 ~ 100)
frame string No "none" デバイスまたはウィンドウのフレーム: nonemacos-lightmacos-darkwindows-lightwindows-darkbrowser-lightbrowser-darkiphoneiphone-darkmacbookmacbook-darkipadipad-dark
frameTitle string No - ウィンドウフレームのタイトルバーに表示されるタイトルテキスト
socialPreset string No "none" SNS 向けサイズにリサイズ: nonetwitterlinkedininstagram-squareinstagram-storyfacebookproducthunt
watermarkText string No - 任意のウォーターマークテキストオーバーレイ
watermarkPosition string No "bottom-right" ウォーターマークの位置: top-lefttop-rightbottom-leftbottom-rightcenter
watermarkOpacity number No 50 ウォーターマークの不透明度 (0 ~ 100)
outputFormat string No "png" 出力形式: pngjpegwebp

Example Request

curl -X POST http://localhost:1349/api/v1/tools/image/beautify \
  -F "file=@screenshot.png" \
  -F 'settings={"backgroundType":"linear-gradient","gradientStops":[{"color":"#667eea","position":0},{"color":"#764ba2","position":100}],"gradientAngle":135,"padding":64,"borderRadius":12,"shadowPreset":"medium","frame":"macos-dark","socialPreset":"twitter"}'

With Background Image

curl -X POST http://localhost:1349/api/v1/tools/image/beautify \
  -F "file=@screenshot.png" \
  -F "backgroundImage=@bg-texture.jpg" \
  -F 'settings={"backgroundType":"image","padding":80,"borderRadius":16,"shadowPreset":"dramatic"}'

Example Response

{
  "jobId": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "downloadUrl": "/api/v1/download/a1b2c3d4-e5f6-7890-abcd-ef1234567890/screenshot.png",
  "originalSize": 234567,
  "processedSize": 567890
}

Notes

  • 2 つのファイルフィールドを受け付けます: file (必須、メインのスクリーンショット) と backgroundImage (任意、backgroundTypeimage の場合に使用)。
  • HEIC、RAW、PSD、SVG の入力形式をサポートします (自動的にデコードされます)。
  • シャドウプリセットは特定の値にマッピングされます:
    • subtle: ぼかし 20、offsetY 4、不透明度 20%
    • medium: ぼかし 40、offsetY 10、不透明度 35%
    • dramatic: ぼかし 80、offsetY 20、不透明度 50%
  • SNS プリセットは、contain モードを使用して最終出力をターゲットサイズに合わせてリサイズします:
    • twitter: 1600x900
    • linkedin: 1200x627
    • instagram-square: 1080x1080
    • instagram-story: 1080x1920
    • facebook: 1200x630
    • producthunt: 1270x760
  • デバイスフレーム (iphonemacbookipad) は画像の周囲にハードウェアのベゼルを適用し、borderRadius 設定をスキップします。
  • 透明度が必要な場合 (シャドウ、角の丸み、デバイスフレーム、透明背景)、jpeg が選択されていても出力は PNG に強制されます。
  • 画像背景はパイプライン/バッチモードではサポートされません。