CS2 徽章是透過《Counter-Strike 2》獲得的視覺成就獎盃——在 Rank 40 授予的服役勳章、隨著 Steam 經驗值升級而解鎖的個人檔案徽章，以及透過持續正面表現獲得的表揚徽章。一旦開始收集徽章，許多開發者接下來會採取的步驟，就是將這些成就展示在作品集的 README、個人網站或團隊說明文件頁面上。一個靜態的 Shields.io 徽章能將像「Service Medal 2026」或「Rank 40」這樣的一句話，轉化為一眼就能掃讀的視覺標記。問題在於，徽章背後的網址是用字面上的連字號來分隔標籤、文字內容與顏色，將空格編碼為底線，並將應顯示在可見文字中的連字號或底線重複。完整路徑語法記錄於 Shields.io 靜態徽章參考文件。Badge Generator 將這些規則轉化為一個聚焦的表單，讓你無需記住任何路徑跳脫字元，就能建立 CS2 徽章網址、Markdown 程式碼片段和 HTML 圖片標籤。它完全在瀏覽器中執行，會檢查顏色與標誌輸入，並讓你在複製任何內容之前，先比較即時預覽與產生的程式碼。
適合轉化為靜態徽章的 CS2 成就
並非每個 CS2 獎勵都適合做成 README 徽章。靜態徽章最適合用於你能永久背書、不需要即時更新的標籤。以下分類能清楚地對應到簡短、穩定的敘述，讓讀者一眼就能辨識。
- 服役勳章 (Service Medal)——在你於配對模式中達到 Rank 40 時授予的年度聲望勳章。勳章名稱與年份在解鎖後即固定不變，讓標籤在跨賽季時容易維護。
- 個人檔案等級 (Profile level)——透過比賽與消費累積 Steam 經驗值時獲得。一個固定的個人檔案等級徽章適合作為里程碑;至於會即時變動的等級，則不適合放在靜態敘述中。
- 表揚 (Commendations)——隊友依據行為、溝通、教學與領導力頒發的聲望徽章。表揚類別名稱(Teacher、Friendly、Leader)夠穩定，適合用於宣傳。
- 活動任務獎勵 (Event mission rewards)——完成限時行動或任務後授予的賽季徽章。它們有固定名稱，當你完成一項行動後，便能驕傲地公開展示。
規劃簡短的標籤與簡潔的文字內容
標籤會出現在徽章左側，文字內容則在右側。兩者都應保持夠短，以便在典型 README 寬度下容納一行，因為過長的文字內容會被截斷，或在行動裝置螢幕上以難以預測的方式換行。
對於 CS2 成就，讀起來順暢的候選標籤包括:
- Service Medal——文字內容如 2026 或 Rank 40
- Profile——文字內容如 Level 100 或 Lvl 40
- Commendation——文字內容如 Teacher 或 Friendly
- Achievement——文字內容如 Master Guardian，作為穩定的階級里程碑
- Operation——文字內容如 Broken Fang，代表已完成的行動
挑選一個與成就語氣相符的徽章顏色。綠色與藍色讀起來較正面，橘色與紅色帶有警告意味，灰色則為中性資訊。工具接受簡寫名稱形式，例如 blue、brightgreen 或 inactive，或三碼與六碼的十六進位值，並可選擇是否加上前置井字號。獨立的標籤顏色可讓你在想要額外凸顯成就類別時，為左側上色。
四個步驟建立 CS2 徽章
開啟 Badge Generator，依序完成下列步驟。每個輸入會即時更新 Shields.io 即時預覽，代表你可以在複製前，先比較渲染結果與產生的程式碼。
- 輸入簡短標籤與文字內容。以 2026 年的服役勳章為例，標籤使用 Service Medal，文字內容使用 2026。空格在網址中會編碼為底線，而可見文字中出現的字面連字號或底線則會重複，避免被誤認為徽章各部分之間的分隔符號。
- 選擇徽章顏色、選用的標籤顏色，以及支援的樣式。挑選像 blue 或 brightgreen 這類具名顏色，或輸入像 2a475e 這樣的十六進位值。選擇一種樣式——flat、flat-square、plastic 或 for-the-badge——以符合你 README 的視覺風格。
- 選擇性加入 Simple Icons 識別碼。如果你想在標籤旁邊放一個小型的《Counter-Strike》標誌，輸入識別碼並確認預覽仍能正確渲染。識別碼必須符合 Simple Icons 識別碼的格式，產生器會在到達網址之前先拒絕格式錯誤的輸入。
- 複製圖片網址、Markdown 或 HTML。直接圖片網址適用於接受遠端徽章圖片的系統。Markdown 程式碼片段可直接貼入 GitHub 或 GitLab 的 README、issue 範本或說明文件。HTML 版本則提供已跳脫的 alt 屬性與圖片來源，供接受標記語法的網站使用。
為目的地挑選合適的輸出格式
Badge Generator 從同一個標準網址回傳三種格式。正確的選擇取決於徽章將放置的位置，以及周圍系統處理遠端圖片的方式。
| 格式 | 最適用於 | 你會得到 |
|---|---|---|
| 直接圖片網址 | 接受遠端圖片的平台、自訂後端、儀表板或靜態網站產生器 | 一個 img.shields.io 網址，在請求時回傳 SVG |
| Markdown | GitHub 或 GitLab 的 README、issue 範本、發布說明、專案文件 | 以 Markdown 包裝的圖片連結，讓徽章與周圍文字一起內嵌顯示 |
| HTML | 接受標記語法的網頁與 CMS 內容 | 一個已跳脫的 <img> 標籤，內含供螢幕閱讀器使用的字面量 alt 屬性 |
對多數開發者檔案而言，Markdown 是最簡便的搭配。需要控制 alt 文字、將徽章包進連結，或為圖片套用 CSS 時，就使用 HTML。當目的地無法解析 Markdown 或 HTML、且只接受遠端圖片來源時，則使用直接圖片網址。
靜態 CS2 徽章的誠實限制
靜態徽章是在描述，不是在證明。在文字內容欄位寫上「passing」或「Rank 40」，並不能驗證你的帳號在讀者閱讀的當下確實擁有該階級。Shields.io 徽章是一張渲染出來的 SVG 圖片，只反映你在表單中輸入的文字。
由此衍生出兩個實務上的後果。
- 僅限靜態標籤。將靜態徽章用於你願意長期維護的穩定敘述——已完成的行動、里程碑式的個人檔案等級，或代表性的階級。若資料需要追蹤即時配對階級或當下的個人檔案等級，請改為將 CI 工作流程或註冊表徽章指向相關的端點。
- 顏色絕對不能單獨承載意義。用紅色徽章代表服役勳章會造成混淆，但更重要的是，色盲讀者仰賴的是可見文字。務必加入周圍的說明文字，或設定一個有意義的 alt 屬性，如此一來，即使顏色被忽略或移除，內容脈絡仍然清楚。
Badge Generator 的檢查機制對含糊或不安全的輸入非常嚴格。標籤與文字內容必須包含可見文字、保持在實際的長度上限內，並且不得包含控制字元。顏色接受簡寫名稱形式，或三碼與六碼的十六進位值，可選擇在建立網址前移除前置的井字號。標誌值必須符合 Simple Icons 識別碼的格式。這些檢查能攔截常見的打字錯誤，卻不會宣稱能驗證外部服務上每一種既有的具名顏色或標誌。
在你提交前先測試渲染後的目的地
以徽章實際顯示的大小預覽幾種樣式。flat-square 徽章在資訊密集的儀表板上顯得俐落，而 for-the-badge 在作品集標題處則更具份量。工具中的 Shields.io 預覽是從公開的 Shields.io 服務載入，因此網路請求會送至該服務商——你的表單資料永遠不會從瀏覽器傳送到 Lizely。
若標誌未顯示，請對照目前的 Simple Icons 目錄驗證其識別碼;產生器只檢查格式是否正確，並不會確認識別碼是否仍然存在。若你的目標平台代理遠端圖片，變更可能會在工具外被快取，因此在反覆調整顏色或標籤時，請規劃強制重新整理。將 Markdown 貼到測試分支、渲染 README，並在合併前確認 alt 文字讀起來自然。
整合應用
若要產生可預期的 CS2 徽章，做法很簡單:選擇一個簡短、能指出成就名稱的標籤，寫一段簡潔的文字內容說明你想讓讀者知道的事，挑選一個符合語氣的顏色，從 Badge Generator 複製 Markdown 或 HTML，並在實際呈現的位置預覽結果。表單會處理路徑跳脫字元、查詢參數與標誌編碼，讓你能把焦點放在徽章對你在遊戲時光中所代表的意義。靜態徽章是宣傳里程碑的乾淨方式;當底層事實經常變動時，請改用能讀取即時資料的 CI 或端點徽章。