前言¶

做網頁的人大多遇到過這類需求：「幫我做個頁面」「這個太醜了」「能不能高級一點」。麻煩不在寫代碼，而在審美：白底、紫藍漸變、三張一模一樣的卡片，做出來的東西一眼就是 AI 生成的。下面介紹的這個 Skill，就是衝着這個問題來的。

這是什麼¶

「告別 AI 味·網頁設計skill」（座標 @user_cf574616/web-design-craft）是一個面向網頁與前端界面設計的技能，定位是「高審美網頁與前端界面設計手藝 + 17 個風格迥異的完整參考案例」。它由社區作者 user_cf574616 發佈，版本 1.0.1，來源 community，SkillHub 分類爲 content-creation，標籤 requires_api_key=false。

官方地址：

https://api.skillhub.cn/user_cf574616/web-design-craft

SkillHub 頁面：

https://www.skillhub.cn/skills/user_cf574616/web-design-craft

官方簡介稱，該技能由 Claude Opus 5.5 蒸餾而來；交付物是一個雙擊就能打開的網頁文件，不用裝軟件，也不用懂代碼。平臺頁面數據顯示評分 100000。

核心功能¶

資料中核實到的能力如下。

1、覆蓋面。品牌官網、落地頁、活動頁、作品集、數據看板、產品文檔都能做。用戶說「做個頁面」「太醜了」「沒有設計感」「高級一點」，即使沒提到「設計」或「風格」，也應啓用本 skill。

2、17 種預設風格：雜誌編輯、瑞士網格、新野獸派、暗黑科技、日式侘寂、復古終端、極光玻璃、奢品高定、童趣黏土、數據看板、千禧復古、自然有機、蘋果式產品頁、技術文檔、裝飾藝術、新中式青綠、動態排版。每種風格附有一個能真正上手操作的完整樣板，技能會按用戶的行業和想要的感覺自動挑選。

3、AI 味檢查。交付前逐條排查 13 種常見的 AI 通病，包括白底、紫藍漸變、三張一樣的卡片這類「一眼 AI」的做法。

4、中文排版規範。中文字體怎麼選、行距留多少、中英文怎麼混排、豎排標題怎麼寫，都有專門規範。

5、五步設計流程。讀懂需求、選定風格、建立規範、由粗到細、逐條檢查，用來穩定產出效果，不靠運氣。

6、細節與適配。紋理、光影、動畫、按鈕的按壓反饋都有講究；沒有圖片素材時，直接用代碼畫出來；電腦和手機上都好看。

安裝與啓用¶

資料中沒有給出安裝命令、目錄路徑或配置字段，只有上述官方地址和 SkillHub 頁面。可覈實的兩點：

1、標籤 requires_api_key=false，即不需要 API key。
2、座標爲 @user_cf574616/web-design-craft，版本 1.0.1，來源 community。

使用方式按官方說法，直接說需求即可，例如：

幫我做一個獨立咖啡店的官網，要溫暖有手作感
做一箇中秋活動頁，新中式風格

典型用法¶

從官方資料中可復現的流程如下。

1、提出需求。說清做什麼頁面、什麼感覺，比如「獨立咖啡店的官網，溫暖有手作感」。
2、自動選風格。技能按行業和感覺從 17 種風格中挑選，例如中秋活動頁對應新中式風格。
3、執行五步流程。讀懂需求 → 選定風格 → 建立規範 → 由粗到細 → 逐條檢查。
4、交付。產出一個雙擊即可打開的網頁文件。

適用場景與注意¶

適合：要做、改、美化任何帶界面的東西——網頁、落地頁、官網、作品集、活動頁、儀表盤、後臺、文檔站，或 HTML/CSS/React/Vue/Tailwind 組件。

注意：

1、風格是 17 種預設之一，按行業和感覺自動挑選，不是無限風格庫；想要特定風格時需要把感覺說清楚。
2、交付物是單個網頁文件，不是可直接上線的完整工程。
3、資料中的評分與下載量是平臺頁面抓取時的數值，後續可能變化。

結尾¶

這個 Skill 的價值在於把「做個頁面」這類模糊需求，收斂到選風格、建規範、逐條檢查的流程裏，並把 13 種常見 AI 味擋在交付之前。官方地址：

https://api.skillhub.cn/user_cf574616/web-design-craft