跳至主要內容
Lizely

標籤生成器

建立 Shields.io 標籤 URL、Markdown 片段與 HTML 圖片標籤，無需記憶路徑轉義或查詢引數。

隱私權：你的檔案不會離開裝置，所有處理均在瀏覽器本機完成。

使用方式

  1. 1.輸入一個簡短的標籤以及你希望徽章顯示的訊息。
  2. 2.選擇一個命名或十六進位的徽章顏色、一個可選的標籤顏色，以及一個支援的樣式。
  3. 3.可選擇輸入 Simple Icons 的 slug，然後確認即時的 Shields.io 預覽。
  4. 4.複製圖片 URL、Markdown 或 HTML 並測試於目標文件中。

關於標籤生成器

一個小型狀態標籤可以讓 README、檔案頁、釋出說明或專案儀錶板更容易掃讀。困難的部分很少是用詞問題。困難的是記住靜態 Shields.io URL 如何區分標籤、訊息與顏色，如何轉義空格與字面分隔符，以及哪些查詢引數會影響最終顯示效果。標籤生成器將這些細節轉化為專注的表單。輸入應出現在左右兩側的文字，選擇預設顏色或十六進位值，選擇支援的樣式，並可選加入 Simple Icons 圖示程式碼。結果會立即更新，讓你可以在複製任何內容前比較視覺預覽與產生的程式碼。

產生器會回傳三種實用格式。直接圖片 URL 適合用於接受遠端徽章圖片的系統。Markdown 版本可以貼到 GitHub 或 GitLab 的 README、問題模板或檔案中。HTML 版本則提供轉義的 alt 屬性和圖片來源，用於接受標籤的網站。可見文字中的實際破折號和底線會依照 Shields.io 的 doubling 規則進行編碼，其他特殊字元則使用 URL 編碼。這可以避免標籤內的破折號被誤認為是徽章各部分之間的分隔符。選項樣式、標籤顏色和 Logo 值則以查詢引數方式新增，而非混入路徑中。

驗證在模糊或不安全輸入周圍故意採用嚴格標準。標籤和訊息必須包含可見文字，保持在實際長度限制內，且不得包含控制字元。顏色可接受緊湊的名稱形式或三、六位數的十六進位值，在建立 URL 前可選擇移除前導井號。標誌值必須看起來像 Simple Icons 的 slug。這些檢查能捕捉常見的輸入錯誤，而無需假裝驗證所有可能的顏色或標誌是否目前存在於外部服務中。預覽本身從 Shields.io 載入，因此顯示它會向該供應商發出網路請求；表單資料並不會提交至 Lizely。

產生的徽章僅為展示用途，並非證明。手動輸入的「透過」、「安全」或「100%」訊息，無法驗證專案、稽核或覆蓋率報告。使用靜態徽章用於穩定的標籤、連結、版本或宣告，這些是你願意維護的內容。對於會自動變化的資訊，請使用由相關持續整合系統、套件登入檔或已驗證端點支援的徽章。在需要語境的地方，也請加上週遭文字或有意義的替代文字說明，因為單獨使用顏色永遠無法傳達完整意義。

為獲得預測結果，請從簡短的標籤開始，例如 build、docs、version 或 license，並搭配簡潔的訊息。在徽章實際顯示的尺寸下預覽多種樣式。複製用於倉庫檔案的 Markdown 或 HTML 用於網頁，然後測試渲染後的目標位置。若 Logo 未顯示，請確認其 slug 是否符合目前 Simple Icons 目錄。若目標平臺會代理遠端圖片，變更可能會被快取在此工具之外。徽章產生器除了遠端預覽圖片外，完全為客戶端執行，無需帳號，也不會儲存徽章歷史紀錄。

方法與來源

透過轉義字元分隔符、URL 編碼文字、驗證顏色與 Logo 輸入、並透過 URLSearchParams 加入支援選項，建立檔案中記錄的 Shields.io 靜態徽章路徑。Markdown 與 HTML 程式碼片段皆來自相同的標準 URL。

常見問題

為何產生的路徑中破折號或底線會被重複？
Shields.io 使用破折號分隔徽章各部分，並用底線表示空格。雙重符號會在可見文字中保留實際的破折號或底線。
預覽會把我的表單資料傳送到 Lizely 嗎？
第幾個。產生過程發生在你的瀏覽器內。預覽圖片會透過你所建立的 URL 向 Shields.io 請求，因此該提供者會收到圖片請求。
這個徽章可以自動更新嗎？
這個工具用來產生靜態徽章。當顯示的值需要追蹤變動的外部資料時，請使用 CI、登入檔或端點徽章。

相關工具

開發者工具 使用指南

查看全部