REST API · v1

MakeFav API 文件

從您自己的程式碼、建置腳本和 CI 管線產生完整的 favicon 套件。只需一次請求,即可將任何圖片轉換為 favicon.ico、Apple touch icon、Android 與 PWA 圖示、web manifest,以及可直接貼上的 HTML。

本頁內容

快速入門

MakeFav API 是簡單的 HTTPS + JSON REST API。所有端點都位於同一個基礎 URL 之下:

https://makefav.com/api/v1
  1. 建立免費帳號
    註冊、確認您的電子郵件地址,並保持訂閱 MakeFav 電子報——這是免費方案的唯一條件。
  2. 建立 API 金鑰
    前往帳號中的 API 金鑰頁面,建立個人金鑰。金鑰以 mf_ 開頭,且只會顯示一次,請妥善保存。 管理 API 金鑰
  3. 傳送您的第一個請求
    將圖片上傳到 generate 端點,並儲存回傳的 ZIP 檔:
curl --fail-with-body -sS https://makefav.com/api/v1/generate \
  -H "Authorization: Bearer $MAKEFAV_API_KEY" \
  -F "[email protected]" \
  -F "app_name=My App" \
  -F "theme_color=#2f9e68" \
  -F "radius=20" \
  -o favicons.zip

Unzip favicons.zip, upload the files to your website and paste the HTML code from the end of readme-makefav.txt into the <head> of every page.

驗證

每個對受保護端點的請求都必須包含個人 API 金鑰。您可以隨時在帳號頁面建立、命名及撤銷金鑰: API 金鑰

Send the key as a bearer token in the Authorization header, or – if your HTTP client makes that awkward – in the X-API-Key header. Both are equivalent.

Authorization: Bearer mf_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

# or, alternatively
X-API-Key: mf_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
金鑰屬於已確認電子郵件地址且電子報訂閱狀態為啟用的使用者(免費方案條件)。若電子郵件尚未確認、電子報已停用,或帳號遭停權,所有請求都會回傳 403 Forbidden。
請將 API 金鑰視同密碼:僅保存在伺服器或 CI 機密中,切勿放在瀏覽器程式碼、行動應用程式或公開儲存庫中。若金鑰外洩,請立即撤銷。

Missing or invalid keys return 401 Unauthorized. The GET /sizes and GET /openapi.json endpoints do not require a key.

速率限制

預設情況下,每個 API 金鑰每小時最多可發出 100 次請求。每個已驗證的回應都會告訴您目前的使用狀況:

標頭說明
X-RateLimit-Limit目前時間窗口內允許的最大請求數。
X-RateLimit-Remaining目前時間窗口內剩餘的請求數。
X-RateLimit-Reset時間窗口重置時的 Unix 時間戳記(秒,UTC)。
HTTP/1.1 200 OK
X-RateLimit-Limit: 100
X-RateLimit-Remaining: 97
X-RateLimit-Reset: 1767225600

When the limit is exceeded the API responds with HTTP 429 and the error code rate_limited. Wait until the time in X-RateLimit-Reset before retrying – do not retry in a tight loop.

HTTP/1.1 429 Too Many Requests
Content-Type: application/json
X-RateLimit-Limit: 100
X-RateLimit-Remaining: 0
X-RateLimit-Reset: 1767225600

{"error": {"code": "rate_limited", "message": "Rate limit exceeded. Try again after the reset time."}}

You can check your current quota at any time with GET /me.

端點

端點驗證說明
POST /generateAPI 金鑰建立完整的 favicon 套件。
GET /meAPI 金鑰您的帳號與目前的速率限制狀態。
GET /sizes無列出產生器所產生的所有圖示檔案與尺寸。
GET /openapi.json無機器可讀的 OpenAPI 3.1 規格。

產生 favicon 套件

POST/generate

從單一來源圖片建立完整的 favicon 套件。您可以透過以下三種方式之一傳送圖片:

內容類型圖片欄位說明
multipart/form-dataimage檔案上傳。建議使用,這是最有效率的方式。
application/jsonimage_base64Base64-encoded image, either raw base64 or a data URL such as data:image/png;base64,iVBOR….
application/jsonimage_url圖片的公開 http 或 https 網址。伺服器會下載該圖片(最大 10 MB)。

支援的輸入格式:PNG、JPG、WebP、AVIF、GIF、BMP、SVG 和 ICO。檔案大小上限:10 MB。

參數

所有參數皆為選填。可以用表單欄位(multipart)或 JSON 屬性傳送。無效的值將會使用預設值。

姓名類型/範圍預設值說明
app_name字串,最多 60 個字元My Website您的網站或應用程式名稱,用於 manifest.json 和範例頁面。
short_name字串,最多 24 個字元app_name 的前 12 個字元顯示在 Android 主畫面圖示下方的簡短名稱。
theme_color#rrggbb#ffffff瀏覽器介面顏色(theme-color meta 標籤與 manifest)。
tile_color#rrggbb與 theme_color 相同Windows 開始畫面動態磚的背景顏色。
backgroundtransparent | #rrggbbtransparent瀏覽器、Android 和 Windows 圖示的背景。
apple_background#rrggbb#ffffffApple touch icon 與 maskable 圖示的背景(iOS 不支援透明度)。當 background 為顏色時會忽略此項,改用該顏色。
padding整數,0–40(%)0圖片周圍的留白,以圖示尺寸的百分比表示。
radius整數,0–50(%)0圓角。設為 50 即為圓形。不適用於 Apple 圖示,因為 iOS 會自行加上圓角。
zoom整數,50–400(%)100圖片在圖示內的縮放比例。大於 100 的值會裁切圖片。
offset_x, offset_y數字,-1 到 10水平/垂直移動圖片,以圖示尺寸的比例表示。
path字串/圖示在您伺服器上所存放的資料夾。用於 HTML 程式碼片段、manifest 和 browserconfig。
displaystandalone | fullscreen | minimal-ui | browserstandalone寫入 manifest 的 PWA 顯示模式。
pixelatedauto | 1 | 0auto針對像素藝術使用銳利的最近鄰縮放。auto 會在來源為 64 px 以下時啟用。
maskable1 | 01同時建立 maskable-icon-512x512.png,並為 Android 自適應圖示加上安全區邊距。
ico_sizes以逗號分隔的清單:16、24、32、48、64、128、25616,32,48內嵌於 favicon.ico 的尺寸。
groups以逗號分隔的清單:favicon、apple、android、msfavicon,apple,android,ms要產生的圖示組:瀏覽器 favicon、Apple touch icon、Android/PWA 圖示和 Windows 動態磚。
formatzip | jsonzip回應格式,請見下方說明。

回應

format=zip
Binary ZIP archive with Content-Type: application/zip and Content-Disposition: attachment. Default.
format=json
JSON object with the package id (32 hex characters), the html snippet for your <head> and a files array; each file has name, mime, size (bytes) and base64 contents.

請求範例 – multipart,ZIP 回應

curl --fail-with-body -sS https://makefav.com/api/v1/generate \
  -H "Authorization: Bearer $MAKEFAV_API_KEY" \
  -F "[email protected]" \
  -F "app_name=My App" \
  -F "theme_color=#2f9e68" \
  -F "radius=20" \
  -o favicons.zip
HTTP/1.1 200 OK
Content-Type: application/zip
Content-Disposition: attachment
X-RateLimit-Limit: 100
X-RateLimit-Remaining: 99
X-RateLimit-Reset: 1767225600

<binary ZIP data>

請求範例 – 使用圖片網址的 JSON,JSON 回應

curl --fail-with-body -sS https://makefav.com/api/v1/generate \
  -H "Authorization: Bearer $MAKEFAV_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "image_url": "https://example.com/logo.png",
    "app_name": "My App",
    "theme_color": "#2f9e68",
    "radius": 20,
    "groups": "favicon,apple,android",
    "format": "json"
  }'
{
  "id": "9f86d081884c7d659a2feaa0c55ad015",
  "html": "<link rel=\"apple-touch-icon\" sizes=\"57x57\" href=\"/apple-icon-57x57.png\">\n…\n<meta name=\"theme-color\" content=\"#2f9e68\">",
  "files": [
    {"name": "favicon.ico", "mime": "image/x-icon", "size": 15086, "base64": "AAABAAMAEBAAAAEAIABoBAAANgAAACAg…"},
    {"name": "favicon-16x16.png", "mime": "image/png", "size": 612, "base64": "iVBORw0KGgoAAAANSUhEUgAAABAAAAAQ…"},
    {"name": "manifest.json", "mime": "application/json", "size": 1094, "base64": "ewogICAgIm5hbWUiOiAiTXkgQXBwIiwK…"}
  ]
}

取得您的帳號

GET/me

回傳 API 金鑰所屬的使用者及目前的速率限制狀態。可用來驗證金鑰。需要驗證,無需參數。

請求範例

curl -sS https://makefav.com/api/v1/me \
  -H "Authorization: Bearer $MAKEFAV_API_KEY"

回應範例

{
  "id": 1,
  "email": "[email protected]",
  "name": "Jane Doe",
  "rate_limit": {"limit": 100, "remaining": 97, "reset": 1767225600}
}

列出圖示尺寸

GET/sizes

Returns every icon file the generator can produce, with its pixel size and group. No authentication and no parameters. The group value matches the groups parameter of POST /generate.

請求範例

curl -sS https://makefav.com/api/v1/sizes

回應範例

{
  "files": [
    {"name": "favicon-16x16.png", "size": 16, "group": "favicon"},
    {"name": "favicon-32x32.png", "size": 32, "group": "favicon"},
    {"name": "apple-touch-icon.png", "size": 180, "group": "apple"},
    {"name": "android-icon-192x192.png", "size": 192, "group": "android"},
    {"name": "ms-icon-144x144.png", "size": 144, "group": "ms"}
  ]
}

OpenAPI 規格

GET/openapi.json

回傳此 API 的 OpenAPI 3.1 描述。無需驗證。可匯入 Postman、Insomnia 或 Swagger UI,也可用來產生適用於您所用語言的型別化用戶端。

curl -sS https://makefav.com/api/v1/openapi.json -o makefav-openapi.json

錯誤

Successful requests return HTTP 200. Every error returns a JSON body with a stable, machine-readable code and a human-readable message. Always branch on the code, not on the message text.

HTTP/1.1 422 Unprocessable Content
Content-Type: application/json

{
  "error": {
    "code": "invalid_image",
    "message": "The uploaded file could not be decoded as an image."
  }
}
HTTP 狀態錯誤代碼說明
400bad_request請求格式不正確,例如未傳送圖片,或 JSON 內容無效。
401unauthorized缺少 API 金鑰,或金鑰無效。
403forbidden金鑰擁有者的電子郵件尚未確認、電子報訂閱已停用,或帳號已遭停權。
413file_too_large圖片大於 10 MB。
415unsupported_type不支援該檔案類型或請求內容類型。
422invalid_image無法將檔案解碼為圖片,或無法下載該圖片網址。
429rate_limited請求次數過多。請等到 X-RateLimit-Reset 時間後再試。
500server_error我們這邊發生了問題。請稍後再試;若問題持續,請聯絡支援團隊。

輸出檔案

With all groups enabled, a package contains the files below. Files from disabled groups are left out.

檔案尺寸群組
favicon.ico16, 32, 48 (可設定)一律包含
favicon-16x16.png16 × 16favicon
favicon-32x32.png32 × 32favicon
favicon-96x96.png96 × 96favicon
apple-icon-57x57.png57 × 57apple
apple-icon-60x60.png60 × 60apple
apple-icon-72x72.png72 × 72apple
apple-icon-76x76.png76 × 76apple
apple-icon-114x114.png114 × 114apple
apple-icon-120x120.png120 × 120apple
apple-icon-144x144.png144 × 144apple
apple-icon-152x152.png152 × 152apple
apple-icon-180x180.png180 × 180apple
apple-icon.png192 × 192apple
apple-icon-precomposed.png192 × 192apple
apple-touch-icon.png180 × 180apple
android-icon-36x36.png36 × 36android
android-icon-48x48.png48 × 48android
android-icon-72x72.png72 × 72android
android-icon-96x96.png96 × 96android
android-icon-144x144.png144 × 144android
android-icon-192x192.png192 × 192android
android-icon-512x512.png512 × 512android
web-app-manifest-192x192.png192 × 192android
web-app-manifest-512x512.png512 × 512android
maskable-icon-512x512.png512 × 512android
ms-icon-70x70.png70 × 70ms
ms-icon-144x144.png144 × 144ms
ms-icon-150x150.png150 × 150ms
ms-icon-310x310.png310 × 310ms

其他檔案

檔案已包含說明
favicon.svg僅適用於未使用裁切、縮放、邊距、圓角或背景的 SVG 輸入經過淨化處理的 SVG 副本,適用於支援向量 favicon 的瀏覽器。
manifest.json, site.webmanifestandroid適用於 Android 和可安裝 PWA 的 Web app manifest(兩份相同的副本)。
browserconfig.xmlms含有您的動態磚顏色的 Windows 動態磚設定。
readme-makefav.txt一律包含安裝說明,結尾附有可放入 <head> 的 HTML 程式碼。

程式碼範例

Each example uploads logo.png with a few options and saves favicons.zip, handling API errors. Set the environment variable MAKEFAV_API_KEY to your API key first.

Multipart 上傳:

# Multipart upload (recommended). --fail-with-body exits non-zero on HTTP errors
# and still saves the JSON error body, so you can inspect it.
curl --fail-with-body -sS https://makefav.com/api/v1/generate \
  -H "Authorization: Bearer $MAKEFAV_API_KEY" \
  -F "[email protected]" \
  -F "app_name=My App" \
  -F "theme_color=#2f9e68" \
  -F "radius=20" \
  -o favicons.zip \
  || { echo "Request failed:"; cat favicons.zip; rm -f favicons.zip; exit 1; }

含 base64 編碼圖片的 JSON 內容(需要 jq):

# JSON body with a base64-encoded image (built with jq to avoid argument length limits)
base64 < logo.png | tr -d '\n' > logo.b64
jq -n --rawfile img logo.b64 \
  '{image_base64: $img, app_name: "My App", theme_color: "#2f9e68", radius: 20}' \
| curl --fail-with-body -sS https://makefav.com/api/v1/generate \
    -H "Authorization: Bearer $MAKEFAV_API_KEY" \
    -H "Content-Type: application/json" \
    --data-binary @- \
    -o favicons.zip \
  || { echo "Request failed:"; cat favicons.zip; rm -f favicons.zip; exit 1; }

HTML 用法

Upload all files to the folder you set with path, then paste the snippet into the <head> of every page. It is included at the end of readme-makefav.txt in the package and, with format=json, returned in the html field. Example for the options used in the code examples above:

<head>
  <meta charset="utf-8">
  <title>My App</title>

  <link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
  <link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
  <link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
  <link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
  <link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
  <link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
  <link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
  <link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
  <link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
  <link rel="icon" href="/favicon.ico" sizes="any">
  <link rel="manifest" href="/manifest.json">
  <meta name="msapplication-TileColor" content="#2f9e68">
  <meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
  <meta name="msapplication-config" content="/browserconfig.xml">
  <meta name="theme-color" content="#2f9e68">
</head>

部署後,請清除瀏覽器快取,或以私密視窗開啟網站,因為瀏覽器會積極快取 favicon。

更新日誌

v1

  • MakeFav REST API 首次公開發布。
  • Endpoints POST /generate, GET /me, GET /sizes and GET /openapi.json.
  • 支援 ZIP 與 JSON 回應格式,以及 multipart、base64 和網址圖片輸入。
  • 個人 API 金鑰,每小時 100 次請求。

第 1 版穩定:我們只會新增選填的參數和欄位。重大變更將以新版本發布,並會提前通知。

支援

有問題、錯誤回報,或需要更高的速率限制嗎?我們樂意協助。請在訊息中附上請求時間與錯誤代碼,切勿提供您的 API 金鑰。