Taste-Skill讓 AI 寫出的前端頁面告別模板味【免費下載鏈接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop項目地址: https://gitcode.com/GitHub_Trending/ta/taste-skillTaste-Skill 是一套面向 AI 編程代理的反模板技能包把設計規(guī)則裝進 Codex、Cursor、Claude Code 等工具里讓它生成的落地頁、作品集在布局、字體和動效上不再千篇一律。適合正在用 AI 搭建界面、或想把老項目改得更精致的人。兩條命令裝好先確認能用它沒有構(gòu)建步驟也不需要額外的包依賴——核心就是skills/目錄下的一批SKILL.md指令文件代理能直接加載。git clone https://gitcode.com/GitHub_Trending/ta/taste-skill裝完之后有三種用法按場景挑整倉放進代理環(huán)境讓代理掃描skills/目錄一次加載全部技能只裝單個技能按SKILL.md頭部 frontmatter 里的name:字段指定安裝名注意不是文件夾名比如默認技能的安裝名是design-taste-frontend最輕量的方式把某個SKILL.md直接復制進項目或粘貼進 ChatGPT / Codex 對話。一個容易踩的點默認的taste-skill目前已是 v2實驗性重寫版。如果你之前裝過 v1重新跑一遍安裝命令即可原地升級安裝名沒變腳本不用改。若你依賴 v1 的精確行為單獨指定design-taste-frontend-v1鎖定舊版本。按任務選技能別一次全開倉庫里的技能分兩類輸出代碼的實現(xiàn)技能和只出參考圖的生圖技能。每個技能只做一件事按需取用。實現(xiàn)類輸出代碼目錄適合場景skills/taste-skill通用默認項先裝它最穩(wěn)skills/gpt-tasteskill想要更嚴格的版式與動效約束、更強反模板規(guī)則skills/redesign-skill已有項目先審查 UI再修布局、間距與層級skills/output-skill代理總愛交半成品、輸出被截斷時skills/minimalist-skill/skills/soft-skill/skills/brutalist-skill視覺方向已定極簡、高級柔和、粗野工業(yè)三選一skills/stitch-skill需要兼容 Google Stitch 規(guī)則、導出DESIGN.md生圖類只出圖不出碼imagegen-frontend-web網(wǎng)頁構(gòu)圖、imagegen-frontend-mobile移動端屏幕與流程、brandkit品牌板Logo、配色、字體。搭配 ChatGPT Images 或同類生成器使用把出的圖再交給編碼代理落地。規(guī)則本身不綁定框架——它約束的是設計意圖而非某個框架 API所以 React、Vue、Svelte 項目都能用。用三個撥盤微調(diào)版式、動效與密度默認技能在 v2 里的核心配置是三個 1–10 的撥盤位于SKILL.md頂部DESIGN_VARIANCE布局實驗度。低值偏居中對齊的干凈感高值偏不對稱與更激進的現(xiàn)代布局MOTION_INTENSITY動效深度。從僅 hover 到滾動驅(qū)動、磁性交互VISUAL_DENSITY單屏信息量。低值是留白充裕高值接近儀表盤密度。基線值為8 / 6 / 4。想改成極簡風可以壓到5 / 3 / 2附近做代理公司的實驗向落地頁則推向9 / 8 / 3。覆蓋默認值直接在對話里說一句即可不必手動改文件。v2 還加了先讀需求的流程動手前會先推斷頁面類型、受眾、氣質(zhì)詞和已有品牌資產(chǎn)輸出一行 Design Read例如這是一個面向技術買家的 B2B 落地頁走 Linear 式極簡再據(jù)此定撥盤。需求含糊時它會只問一個澄清問題而不是自己瞎猜。效果不達標時這樣排查頁面還是模板味換裝更嚴格的gpt-tasteskillgpt-taste它布局方差更高、動效指令更硬也可以對照research/laziness/remediation/reference-prompts.md里的參考提示詞調(diào)整你的請求方式。輸出總被截斷、交半成品疊加output-skill強制完整輸出、禁止占位注釋。老項目不好看但代碼想保留別讓它直接重畫用redesign-skill先做 UI 審計再按審查結(jié)果修間距、層級與配色。生成過程卡、響應慢先只啟用當前任務需要的單個技能減少指令負擔參數(shù)層面的調(diào)優(yōu)思路可看research/laziness/remediation/parameter-tuning.md若本地運行腳本有依賴問題核對 Node.js 版本后重新安裝依賴再對照CHANGELOG.md確認版本變更。v2 行為不合預期按前面說的鎖定design-taste-frontend-v1并到CHANGELOG.md里查 v1→v2 的具體差異。組合玩法從一張參考圖到上線頁面技能之間是流水線關系串起來能省很多來回溝通圖 → 碼一條龍用image-to-code-skillimage-to-code在提示詞里寫明流水線順序例如follow the skill: generate images, then analyze, then code它會先生成網(wǎng)站參考圖、再分析、最后實現(xiàn)前端手動分步版用imagegen-frontend-web或imagegen-frontend-mobile出構(gòu)圖brandkit出品牌板再把渲染結(jié)果丟給 Codex、Cursor 或 Claude Code 落地實現(xiàn)改造 精修r(nóng)edesign-skill先修結(jié)構(gòu)再用soft-skill或minimalist-skill統(tǒng)一視覺語氣貢獻新技能在skills/下新建文件夾、按既有格式寫一份SKILL.md描述功能與用法然后提交 PR 或 Issue 給維護者。倉庫里還有這些值得翻skills/llms.txt面向 LLM 的技能索引喂給代理做全局加載很方便research/laziness/一套完整研究文檔分root-causes/AI 產(chǎn)出平庸的成因、remediation/提示詞與參數(shù)層面的對策和findings/實證結(jié)果想理解規(guī)則背后的理由可以按圖索驥CHANGELOG.mdv1 到 v2 的完整差異與動機升級前掃一眼;LICENSEMIT 協(xié)議可自由商用與分發(fā)。下一步建議先只裝taste-skill跑一個真實小頁面確認 Design Read 和撥盤機制符合你的預期再按任務逐步引入redesign-skill、image-to-code-skill等專用技能——技能之間互不沖突但一次全開會讓代理的指令負擔變重?！久赓M下載鏈接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop項目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 Taste-Skill：讓 AI 寫出的前端頁面告別模板味
Taste-Skill讓 AI 寫出的前端頁面告別模板味【免費下載鏈接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop項目地址: https://gitcode.com/GitHub_Trending/ta/taste-skillTaste-Skill 是一套面向 AI 編程代理的反模板技能包把設計規(guī)則裝進 Codex、Cursor、Claude Code 等工具里讓它生成的落地頁、作品集在布局、字體和動效上不再千篇一律。適合正在用 AI 搭建界面、或想把老項目改得更精致的人。兩條命令裝好先確認能用它沒有構(gòu)建步驟也不需要額外的包依賴——核心就是skills/目錄下的一批SKILL.md指令文件代理能直接加載。git clone https://gitcode.com/GitHub_Trending/ta/taste-skill裝完之后有三種用法按場景挑整倉放進代理環(huán)境讓代理掃描skills/目錄一次加載全部技能只裝單個技能按SKILL.md頭部 frontmatter 里的name:字段指定安裝名注意不是文件夾名比如默認技能的安裝名是design-taste-frontend最輕量的方式把某個SKILL.md直接復制進項目或粘貼進 ChatGPT / Codex 對話。一個容易踩的點默認的taste-skill目前已是 v2實驗性重寫版。如果你之前裝過 v1重新跑一遍安裝命令即可原地升級安裝名沒變腳本不用改。若你依賴 v1 的精確行為單獨指定design-taste-frontend-v1鎖定舊版本。按任務選技能別一次全開倉庫里的技能分兩類輸出代碼的實現(xiàn)技能和只出參考圖的生圖技能。每個技能只做一件事按需取用。實現(xiàn)類輸出代碼目錄適合場景skills/taste-skill通用默認項先裝它最穩(wěn)skills/gpt-tasteskill想要更嚴格的版式與動效約束、更強反模板規(guī)則skills/redesign-skill已有項目先審查 UI再修布局、間距與層級skills/output-skill代理總愛交半成品、輸出被截斷時skills/minimalist-skill/skills/soft-skill/skills/brutalist-skill視覺方向已定極簡、高級柔和、粗野工業(yè)三選一skills/stitch-skill需要兼容 Google Stitch 規(guī)則、導出DESIGN.md生圖類只出圖不出碼imagegen-frontend-web網(wǎng)頁構(gòu)圖、imagegen-frontend-mobile移動端屏幕與流程、brandkit品牌板Logo、配色、字體。搭配 ChatGPT Images 或同類生成器使用把出的圖再交給編碼代理落地。規(guī)則本身不綁定框架——它約束的是設計意圖而非某個框架 API所以 React、Vue、Svelte 項目都能用。用三個撥盤微調(diào)版式、動效與密度默認技能在 v2 里的核心配置是三個 1–10 的撥盤位于SKILL.md頂部DESIGN_VARIANCE布局實驗度。低值偏居中對齊的干凈感高值偏不對稱與更激進的現(xiàn)代布局MOTION_INTENSITY動效深度。從僅 hover 到滾動驅(qū)動、磁性交互VISUAL_DENSITY單屏信息量。低值是留白充裕高值接近儀表盤密度。基線值為8 / 6 / 4。想改成極簡風可以壓到5 / 3 / 2附近做代理公司的實驗向落地頁則推向9 / 8 / 3。覆蓋默認值直接在對話里說一句即可不必手動改文件。v2 還加了先讀需求的流程動手前會先推斷頁面類型、受眾、氣質(zhì)詞和已有品牌資產(chǎn)輸出一行 Design Read例如這是一個面向技術買家的 B2B 落地頁走 Linear 式極簡再據(jù)此定撥盤。需求含糊時它會只問一個澄清問題而不是自己瞎猜。效果不達標時這樣排查頁面還是模板味換裝更嚴格的gpt-tasteskillgpt-taste它布局方差更高、動效指令更硬也可以對照research/laziness/remediation/reference-prompts.md里的參考提示詞調(diào)整你的請求方式。輸出總被截斷、交半成品疊加output-skill強制完整輸出、禁止占位注釋。老項目不好看但代碼想保留別讓它直接重畫用redesign-skill先做 UI 審計再按審查結(jié)果修間距、層級與配色。生成過程卡、響應慢先只啟用當前任務需要的單個技能減少指令負擔參數(shù)層面的調(diào)優(yōu)思路可看research/laziness/remediation/parameter-tuning.md若本地運行腳本有依賴問題核對 Node.js 版本后重新安裝依賴再對照CHANGELOG.md確認版本變更。v2 行為不合預期按前面說的鎖定design-taste-frontend-v1并到CHANGELOG.md里查 v1→v2 的具體差異。組合玩法從一張參考圖到上線頁面技能之間是流水線關系串起來能省很多來回溝通圖 → 碼一條龍用image-to-code-skillimage-to-code在提示詞里寫明流水線順序例如follow the skill: generate images, then analyze, then code它會先生成網(wǎng)站參考圖、再分析、最后實現(xiàn)前端手動分步版用imagegen-frontend-web或imagegen-frontend-mobile出構(gòu)圖brandkit出品牌板再把渲染結(jié)果丟給 Codex、Cursor 或 Claude Code 落地實現(xiàn)改造 精修r(nóng)edesign-skill先修結(jié)構(gòu)再用soft-skill或minimalist-skill統(tǒng)一視覺語氣貢獻新技能在skills/下新建文件夾、按既有格式寫一份SKILL.md描述功能與用法然后提交 PR 或 Issue 給維護者。倉庫里還有這些值得翻skills/llms.txt面向 LLM 的技能索引喂給代理做全局加載很方便research/laziness/一套完整研究文檔分root-causes/AI 產(chǎn)出平庸的成因、remediation/提示詞與參數(shù)層面的對策和findings/實證結(jié)果想理解規(guī)則背后的理由可以按圖索驥CHANGELOG.mdv1 到 v2 的完整差異與動機升級前掃一眼;LICENSEMIT 協(xié)議可自由商用與分發(fā)。下一步建議先只裝taste-skill跑一個真實小頁面確認 Design Read 和撥盤機制符合你的預期再按任務逐步引入redesign-skill、image-to-code-skill等專用技能——技能之間互不沖突但一次全開會讓代理的指令負擔變重?！久赓M下載鏈接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop項目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考