taste-skill

สกิลทำ Landing Page ของ Elaya คืออะไร ช่วยให้เว็บพ้นหน้าตา AI ได้จริงไหม? โดย Nokka (นก-กา) | 31 ต.ค. 2026 !ภาพประกอบ: กระดาษร่างหน้าเว็บสี่แผ่นวางเรียงเหลื่อมกันเป็นขั้นบันไดบนโต๊ะ มือหนึ่งกำลังเลื่อนแผ่นบนสุดออก มีโพสต์แชร์กันเยอะเรื่องสกิลฟรีที่ทำให้ Claude Code กับ Cursor สร้างหน้าเว็บได้สวยและไม่ซ้ำใคร ตัวเลขที่โพสต์บอกคือหกพันดาวบน GitHub โพสต์ต้นทางเป็นข้อความที่ถูกส่งต่อมา ไม่มีลิงก์สาธารณะให้ตรวจ ผมจึงอ้างจากข้อความที่ได้รับ และเทียบกับรีโปจริงซึ่งตรวจได้ทุกบรรทัด ผมเข้าไปดูรีโปจริง เทียบทีละข้อกับที่โพสต์อ้าง แล้วเจอทั้งของจริงและของที่คลาดเคลื่อน รีโปนี้คืออะไรกันแน่ elayadesign/ai-design-skills เป็นชุดสกิลสำหรับเครื่องมือเขียนโค้ดที่อ่านไฟล์กฎ markdown ได้ ไม่ว่าจะเป็น Claude Code, Cursor, Codex, Windsurf หรือ Cline [1] ข้อมูลจาก GitHub API ณ วันที่เขียนบทนี้ - 13,028 ดาว ไม่ใช่หกพันอย่างที่โพสต์บอก ผมคาดว่าตัวเลขในโพสต์มาจากช่วงที่รีโปยังใหม่อยู่ [1] [6] - 957 ฟอร์ก และมี issue เปิดค้าง 2 รายการ [6] - สัญญาอนุญาต MIT ใช้เชิงพาณิชย์ได้ [6] - สร้าง 29 ก.ค. 2026 และ push ล่าสุด 30 ต.ค. 2026 [6] เจ้าของบัญชีชื่อ Elaya มีรีโปสาธารณะสามตัว คือตัวนี้ redesign-skill และ skills [6] รีโป redesign-skill แยกออกไปเพราะทำหน้าที่คนละอย่าง คือใช้ปรับเว็บที่มีอยู่แล้วให้ดูดีขึ้น ไม่ใช่สร้างใหม่ทั้งหน้า [4] ส่วนรีโป skills เป็นฟอร์กของชุดสกิลจาก Anthropic ไม่ใช่ผลงานที่ Elaya เขียนเอง ผมจึงไม่นับรวมในการตรวจครั้งนี้ ตัวสกิลยังระบุด้วยว่าบางส่วนดัดแปลงมาจาก taste-skill ของ Leon Lin ภายใต้สัญญา MIT เช่นกัน [5] ข้างในมีสกิลเดียว ไม่ใช่หลายตัว จุดที่ผมต้องแก้ตั้งแต่ต้น: โพสต์เขียนเหมือนมีหลายสกิลรวมถึงตัวแปลงดีไซน์เป็นคลิป MP4 หรือ GIF ด้วย แต่ไฟล์ในรีโปมีอยู่ชุดเดียว คือ skills/landing-page-design/SKILL.md ยาวราว 22,000 ตัวอักษร [3] ผมค้นทั้งรีโปนี้และรีโป redesign-skill แล้ว ไม่พบสกิลที่แปลงดีไซน์เป็นวิดีโอหรือ GIF เลย คำอ้างนั้นยังไม่มีหลักฐานในรีโป ส่วนอิมเมจที่ใช้ในตัวอย่างโพสต์ทำด้วย Higgsfield ตามที่โพสต์บอกเอง ซึ่งเป็นบริการภายนอกที่ต้องจ่ายเงิน และไม่เกี่ยวกับตัวสกิล สกิลนี้สั่งให้ AI ทำอะไร ตัวไฟล์แบ่งเป็นสองภาคชัดเจน ภาค A ว่าด้วยเนื้อหาและโครงหน้า ภาค B ว่าด้วยกฎภาพที่บังคับใช้ [3] ภาค A ถามก่อนลงมือ สิ่งแรกที่สกิลสั่งคือถามผู้ใช้เป็นชุดเดียว ไม่ใช่ยิงคำถามทีละข้อ ครอบคลุมเป้าหมายเดียวของหน้า กลุ่มเป้าหมาย ข้อโต้แย้งสามข้อแรกที่ทำให้คนไม่ซื้อ ช่องทางที่คนเข้ามา และหลักฐานที่มีอยู่จริง [3] จากนั้นกำหนดโครงสิบสองส่วน เรียงตามต้นทางคือ พาดหัว, คำโปรยใต้พาดหัว, ปุ่มหลัก, หลักฐานชิ้นแรก, ภาพฮีโร่, ปัญหาและทางออก, ประโยชน์สามถึงห้าข้อ, วิธีใช้สามขั้น, รีวิว, FAQ หกถึงสิบสองข้อ, การลดความเสี่ยง และปุ่มปิดท้ายที่เหมือนปุ่มบนสุด [3] ภาค B กฎภาพที่ไม่อ่อนข้อ นี่คือส่วนที่ทำให้คนแชร์กัน และเป็นส่วนที่ผมชอบที่สุด - ฟอนต์ที่ห้ามใช้: Inter, Roboto, Arial, Open Sans, Helvetica [3] - ฟอนต์ที่ให้ใช้: Geist, Manrope, Poppins และ Geist Mono สำหรับตัวเลขหรือโค้ด [3] - ห้ามตัวเอียง ทั้งหน้าจอ และห้ามใช้ระดับหนามากอย่าง ultra bold หรือ 900 โดยให้สูงสุดที่ semibold หรือ bold [3] - ห้ามใช้ขีด (-) ในข้อความ ซึ่งผมคิดว่าเป็นกฎที่คนเขียนเว็บไทยมักทำหลุดโดยไม่รู้ตัว [3] - ห้ามข้อความตัวอย่างเป็นภาษาละติน และห้ามใช้คำว่า "พาดหัวของคุณที่นี่" [3] ข้อสุดท้ายสำคัญกับคนทำธุรกิจจริง คือสกิลสั่งว่า ราคา ตัวเลขสถิติ จำนวนลูกค้า และรีวิว ต้องมาจากผู้ใช้หรือแหล่งจริง ถ้าไม่มีให้ใส่ตัวยึดเช่น {{price}} ไว้ก่อน ห้ามแต่งขึ้นเอง [3] ผมชอบกฎข้อนี้เพราะมันแก้ปัญหาที่เจอบ่อยที่สุด เว็บที่ AI ทำมักดูดีในภาพรวม แต่พออ่านตัวเลขกลับไม่มีที่มา กฎที่ผมคิดว่าแปลกแต่มีเหตุผล ในไฟล์มีส่วน B11 ชื่อ "tagline reveal section" ซึ่งเป็นส่วนที่สกิลบังคับให้ใส่ทุกหน้า [3] แนวคิดคือให้มีจุดหนึ่งที่ประโยคสั้น ๆ ของแบรนด์ค่อย ๆ เผยออกมาระหว่างเลื่อนหน้า เป็นจังหวะที่ทำให้คนจำแบรนด์ได้ ไม่ใช่แค่เห็นสินค้า ผมมองว่านี่เป็นดาบสองคม ใช้ดีก็ทำให้หน้าดูมีชั้นเชิง ใช้ผิดที่ก็กลายเป็นลูกเล่นที่ไม่มีใครอ่าน ส่วนที่บอกตำแหน่งในต้นทางยังไม่ลงรอยกันเอง คือ A2 แนะให้วางหลังฮีโร่หรือหลังส่วนประโยชน์ ขณะที่ B11 กำกับว่าไม่ให้ติดกับฮีโร่ [3] วิธีติดตั้ง วิธีที่รีโปแนะนำคือใช้ CLI ของ skills.sh ซึ่งต้องมี Node.js [2] # ติดตั้งทั้งหมดและเลือกเองว่าจะให้ agent ตัวไหนใช้ npx skills add elayadesign/ai-design-skills # เลือกเฉพาะสกิลนี้ และระบุ agent npx skills add elayadesign/ai-design-skills --skill landing-page-design -a claude-code -a cursor # ติดตั้งระดับผู้ใช้ ไม่ผูกกับโปรเจกต์ npx skills add elayadesign/ai-design-skills -g โฟลเดอร์ปลายทางคือ .claude/skills/ ถ้าใช้ Claude Code ส่วน Cursor, Codex และเครื่องมืออื่นจะได้ไฟล์ใน .agents/skills/ [2] ถ้าไม่ใช้ CLI ก็โคลนรีโปแล้วคัดลอกโฟลเดอร์สกิลไปวางเองได้ หรือดาวน์โหลด SKILL.md ไปอัปโหลดใน Project ของ Claude บนเว็บ [2] ข้อจำกัดที่โพสต์ไม่ได้บอก หนึ่ง สกิลไม่สร้างภาพให้ ตัวไฟล์สั่งให้ใช้ภาพสินค้า ภาพหน้าจอ หรือวิดีโอเดโมที่มีอยู่จริง ถ้าไม่มีภาพก็ต้องหาเองหรือจ้างทำ [3] สอง ค่าฟอนต์ค่าเริ่มต้นเป็นฟอนต์ละติน ถ้าทำเว็บไทยต้องเปลี่ยนเอง เพราะ Geist กับ Manrope ไม่มีชุดตัวอักษรไทย ผมเปิดรายการ subset ของ Google Fonts ดูเอง Manrope ครอบคลุมละติน ไซริลลิก กรีก และเวียดนาม ส่วน Geist ไม่มีกรีก ทั้งสองตัวไม่มีชุดอักษรไทย วิธีที่ผมแนะนำคือแก้ในส่วน B1 ของไฟล์ ให้ใช้ฟอนต์ไทยอย่าง IBM Plex Sans Thai หรือ Noto Sans Thai แล้วคงกฎอื่นไว้ สาม มันไม่ใช่เครื่องมือออกแบบ สกิลนี้ให้ AI เดินตามระบบที่คนอื่นคิดไว้ ไม่ได้คิดแทนคุณในเรื่องแบรนด์ ถ้าแบรนด์ยังไม่ชัด ผลลัพธ์จะเรียบร้อยแต่จำเจ สี่ ตัวเลขบนโพสต์ล้าสมัย ตอนนี้รีโปมีหนึ่งหมื่นสามพันดาว ถ้าคุณเห็นโพสต์ที่บอกหกพัน โพสต์นั้นน่าจะเก่าแล้ว ใครควรใช้ ใครข้ามได้ ควรใช้ถ้า คุณต้องทำหน้าขายของสักหน้าอย่างเร็ว อยากให้ผลลัพธ์ไม่เหมือนเทมเพลต และยอมเสียเวลาตอบคำถามช่วงต้นราวสิบนาที (เป็นการกะของผม) ข้ามได้ถ้า คุณมีดีไซเนอร์อยู่แล้ว หรือหน้าของคุณเป็นแอปที่ต้องมีดีไซน์เฉพาะทาง สกิลนี้ถูกออกแบบมาสำหรับหน้าขายของหน้าเดียว ไม่ใช่ระบบดีไซน์ทั้งผลิตภัณฑ์ สิ่งที่ผมยังไม่รู้ ผมไม่ได้ติดตั้งสกิลนี้แล้วสร้างหน้าจริงในรอบนี้ สิ่งที่ผมตรวจคือตัวไฟล์กฎและข้อมูลรีโปเท่านั้น ดังนั้นคำถามว่า "ใช้แล้วเว็บจะสวยขึ้นจริงไหม" ผมตอบด้วยหลักฐานไม่ได้นอกจากตัวกฎเอง ซึ่งอ่านแล้วสมเหตุสมผล แต่ผลจริงขึ้นกับโมเดลที่รันและ prompt ที่คุณให้ ถ้าคุณลองแล้วได้หน้าตาแบบไหน อยากรู้เหมือนกันครับ แหล่งอ้างอิง [1] GitHub · elayadesign/ai-design-skills (เข้าถึง 31 ต.ค. 2026) · elayadesign/ai-design-skills [2] รีโปเดียวกัน · README วิธีติดตั้ง (เข้าถึง 31 ต.ค. 2026) · github.com/elayadesign/ai-design-skills/blob/main… [3] รีโปเดียวกัน · skills/landing-page-design/SKILL.md (เข้าถึง 31 ต.ค. 2026) · github.com/elayadesign/ai-design-skills/blob/main… [4] GitHub · elayadesign/redesign-skill (เข้าถึง 31 ต.ค. 2026) · elayadesign/redesign-skill [5] GitHub · Leonxlnx/taste-skill ซึ่งเป็นต้นทางบางส่วนของสกิลนี้ (เข้าถึง 31 ต.ค. 2026) · Leonxlnx/taste-skill [6] GitHub REST API · ข้อมูลรีโปและบัญชีผู้ใช้ elayadesign (31 ต.ค. 2026) · api.github.com บทความนี้เขียนโดย AI (deepseek-v4.1-flash · ผู้ให้บริการโมเดล: ollama-cloud) ผ่าน Hermes Agent ภายใต้การควบคุมและตรวจสอบคุณภาพโดยมนุษย์ - Nokka (นก-กา)

Make Claude Code build a landing page with real art direction Ask a coding agent for a landing page and you usually get the same page: a gradient hero, three feature cards, a stock-looking footer. Taste Skill is an Agent Skill that tries to fix that. Per its README, it gives the agent an art direction, real credited pictures, and a way to check its own work in a real browser. Here is the Claude Code route, using the commands from the README. The short version lives on the Deduped use-case page. What it does The README describes a build that runs in steps. The skill reads your brief and lists what only your client has (product, story, materials). A script then deals three art directions, you pick one, and the agent builds with real photographs found in open archives. The skill credits those photos. Finally it checks the result in a real browser at three widths and fixes the top problems for up to three rounds. The point is that the page is built from your specifics, not an average of every landing page the model has seen. Requirements Per the README, the skill runs its scripts with Node 22 or newer and needs an installed Chrome, Edge or Chromium. It installs nothing else and needs no API keys. Finding pictures needs network access. Install in Claude Code Run these inside Claude Code: /plugin marketplace add Leonxlnx/taste-skill /plugin install taste-skill@taste-skill The skill is namespaced under taste-skill:, so it will not collide with your other skills. /plugin update upgrades it later. If you prefer the skills CLI, the README gives this instead: npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend" Codex users have a plugin route too: codex plugin marketplace add Leonxlnx/taste-skill codex plugin add taste-skill@taste-skill Start a new Codex session afterwards so the skill loads. Write a brief that has something in it The skill works best when the brief lists what only this client has. Compare: - Weak: "A landing page for a coffee roaster." - Better: "A landing page for a two-person roaster in Lisbon. They roast on a 1970s Probat, sell only single-origin beans from three farms, and ship on Mondays. Customers are mostly returning subscribers." The second brief gives the skill real material for the art direction step and for choosing pictures. Run it Prompt Claude Code something like: > Use the taste-skill design-taste-frontend skill to build a landing page for <client> from this brief: <brief>. Pick one of the dealt directions, credit every photo, and show me the screenshots from each check round. Then do three things: 1. Look at the three directions it deals and choose one on purpose rather than accepting the first. 2. Open the credits file it produces and confirm the photos have open licenses. 3. Read the screenshots from each check round, so you see what it found and fixed. Things to know - A build takes roughly 30 to 45 minutes and a few hundred thousand tokens, so check your plan limits before starting. - It builds from a brief, so vague input gives vague output. - You still review the page. A browser check at three widths catches layout problems, not whether the copy is true. - Pin to a version you trust if you rely on it for client work, and run /plugin update deliberately. If your agent keeps handing you generic pages, this is a 45 minute experiment: install the plugin, write one specific brief, and compare the result with what you got before. For other ways to steer Claude Code, see the Deduped page on stopping Claude Code from overengineering. Want the setup commands for 50 AI repos people actually ship with? Get the free AI Repos That Actually Ship pack: dedupedai.com

10- Taste Skill: Web siteleri ve uygulama ekranları tasarlamasını sağlayan bir Ajan Becerisidir. Bu, ajana sanat yönü, gerçek fotoğraflar ve kendi çalışmalarını gerçek bir tarayıcıda kontrol etme imkanı veriyor. Leonxlnx/taste-skill

30 Best Claude Plugins on GitHub (Sorted by Your Job) 30 Claude plugins with 3.9 million GitHub stars between them, sorted into 5 rows so you only need yours: coding, research, saving tokens, design, and writing + video. Don't add all 30. Pick the row that fits your week, add one plugin, and open its repo first to check what it can touch on your machine. 💬 Comment ANYLANCER and I'll send you all 30 links, or grab them here: 1) You write code • Superpowers: obra/superpowers • Matt Pocock's Skills: mattpocock/skills • ECC: affaan-m/ECC • Karpathy Skills: multica-ai/andrej-karpathy-skills • Ponytail: DietrichGebert/ponytail • Agent Skills: addyosmani/agent-skills 2) You research big things • Graphify: Graphify-Labs/graphify • Agent Reach: Panniantong/Agent-Reach • Understand Anything: Egonex-AI/Understand-Anything • Last 30 Days: mvanhorn/last30days-skill • Career Ops: career-ops-hq/career-ops • REA: morluto/rea 3) Huge projects, few tokens • gstack: garrytan/gstack • Caveman: JuliusBrussee/caveman • Claude-Mem: thedotmack/claude-mem • Headroom: headroomlabs-ai/headroom • GSD: gsd-build/get-shit-done • BMAD Method: bmad-code-org/BMAD-METHOD 4) Design & visuals • UI UX Pro Max: nextlevelbuilder/ui-ux-pro-max-skill • Taste: Leonxlnx/taste-skill • Archify: tt-a1i/archify • Impeccable: pbakaus/impeccable • PPT Master: hugohe3/ppt-master • Diagram Design: cathrynlavery/diagram-design 5) Writing & video • Anthropic Skills: anthropics/skills • OpenMontage: calesthio/OpenMontage • HyperFrames: heygen-com/hyperframes • Humanizer: blader/humanizer • I Have ADHD: ayghri/i-have-adhd • Marketing Skills: coreyhaines31/marketingskills Built a skill people would pay for? Sell it on Anylancer: anylancer.com Which row are you? 👇 Star counts from GitHub on Oct 29, 2026. This video was made with HyperFrames. #ClaudeCode #AIAgents #GitHub #Shorts

yuuup they found a markdown file that teaches it about serif fonts

This skill makes your coding agent stop shipping generic AI landing pages and start designing like it has taste. 🔗 Leonxlnx/taste-skill Credits: Leonxlnx/taste-skill #tasteskill #javascript #agentskills

개발자들이 선택한 깃허브 디자인·모션 도구 TOP 14 웹사이트 UI 디자인부터 인터랙션, 모션그래픽, 3D 애니메이션까지. 깃허브에서 인기 있고 실제로 쓸 만한 AI 디자인 스킬과 도구 14개를 네 챕터로 정리했습니다. 필요한 챕터만 골라 보세요. 00:00 인트로 00:19 CH1 AI 디자인 스킬 00:19 프론트엔드 디자인 (Anthropic) 00:45 UI UX 프로 맥스 01:11 테이스트 스킬 01:33 홀마크 01:57 임페커블 02:28 CH2 작업공간 02:31 구글 스티치 02:55 오픈디자인 03:19 CH3 웹 인터랙션 03:22 에밀 코왈스키 애니메이션 스킬 03:49 리액트 비츠 04:09 키프레임 갤러리 04:23 CH4 모션그래픽 04:27 리모션 04:44 하이퍼프레임즈 05:06 클로드 모션 05:32 어썸 오푸스 5.5 비디오스 05:51 마무리 ▶ 영상 속 도구 링크 [CH1 AI 디자인 스킬] 프론트엔드 디자인: github.com/anthropics/skills/tree/main/skills/fro… UI UX 프로 맥스: nextlevelbuilder/ui-ux-pro-max-skill 테이스트 스킬: Leonxlnx/taste-skill 홀마크: Nutlope/hallmark 임페커블: pbakaus/impeccable (impeccable.style) [CH2 작업공간] 구글 스티치: stitch.withgoogle.com 오픈디자인: nexu-io/open-design [CH3 웹 인터랙션] 에밀 코왈스키 스킬: emilkowalski/skills 리액트 비츠: reactbits.dev (DavidHDev/react-bits) 키프레임 갤러리: keyframe.gallery [CH4 모션그래픽] 리모션: remotion.dev (remotion-dev/remotion) 하이퍼프레임즈: heygen-com/hyperframes 클로드 모션: claude.com 어썸 오푸스 5.5 비디오스: yihui-dev/awesome-opus5-5-videos [en-US] TOP 14 GitHub Design & Motion Tools Chosen by Developers From website UI design to interactions, motion graphics, and 3D animation. We have organized 14 popular and practically useful AI design skills and tools from GitHub into four chapters. Pick only the chapters you need. 00:00 Intro 00:19 CH1 AI Design Skills 00:19 Frontend Design (Anthropic) 00:45 UI UX Pro Max 01:11 Taste Skills 01:33 Hallmark 01:57 Impeccable 02:28 CH2 Workspace 02:31 Google Stitch 02:55 OpenDesign 03:19 CH3 Web Interactions 03:22 Emil Kowalski Animation Skills 03:49 React Beats 04:09 Keyframe Gallery 04:23 CH4 Motion Graphics 04:27 Remotion 04:44 Hyperframes 05:06 Claude Motion 05:32 Awesome Opus 5.5 Videos 05:51 Wrap-up ▶ Links to tools in the video [CH1 AI Design Skills] Frontend Design: github.com/anthropics/skills/tree/main/skills/fro… UI UX Pro Max: nextlevelbuilder/ui-ux-pro-max-skill Taste Skills: Leonxlnx/taste-skill Hallmark: Nutlope/hallmark Impeccable: pbakaus/impeccable (impeccable.style) [CH2 Workspace] Google Stitch: stitch.withgoogle.com Open Design: nexu-io/open-design [CH3 Web Interactions] Emil Kowalski Skills: emilkowalski/skills React Bits: reactbits.dev (DavidHDev/react-bits) Keyframes Gallery: keyframe.gallery [CH4 Motion Graphics] Remotion: remotion.dev (remotion-dev/remotion) Hyperframes: heygen-com/hyperframes Claude Motion: claude.com Awesome Opus 5.5 Videos: yihui-dev/awesome-opus5-5-videos [id] 14 Alat Desain & Motion GitHub Pilihan Para Developer Mulai dari desain UI situs web hingga interaksi, grafis gerak, dan animasi 3D. Kami telah mengorganisir 14 keterampilan dan alat desain AI yang populer dan praktis dari GitHub ke dalam empat bab. Pilih hanya bab yang Anda butuhkan. 00:00 Pendahuluan 00:19 CH1 Keterampilan Desain AI 00:19 Desain Frontend (Anthropic) 00:45 UI UX Pro Max 01:11 Taste Skills 01:33 Hallmark 01:57 Impeccable 02:28 CH2 Workspace 02:31 Google Stitch 02:55 OpenDesign 03:19 CH3 Interaksi Web 03:22 Keterampilan Animasi Emil Kowalski 03:49 React Beats 04:09 Galeri Keyframe 04:23 CH4 Grafis Gerak 04:27 Remotion 04:44 Hyperframes 05:06 Claude Motion 05:32 Video Awesome Opus 5.5 05:51 Penutup ▶ Tautan ke alat dalam video [CH1 Keterampilan Desain AI] Desain Frontend: github.com/anthropics/skills/tree/main/skills/fro… UI UX Pro Max: nextlevelbuilder/ui-ux-pro-max-skill Taste Skills: Leonxlnx/taste-skill Hallmark: Nutlope/hallmark Impeccable: pbakaus/impeccable (impeccable.style) [Ruang Kerja Bab 2] Google Stitch: stitch.withgoogle.com Open Design: nexu-io/open-design [Interaksi Web Bab 3] Emil Kowalski Skills: emilkowalski/skills React Bits: reactbits.dev (DavidHDev/react-bits) Galeri Keyframes: keyframe.gallery [Grafik Gerak CH4] Remotion: remotion.dev (remotion-dev/remotion) Hyperframes: heygen-com/hyperframes Claude Motion: claude.com Video Awesome Opus 5.5: yihui-dev/awesome-opus5-5-videos

7 أدوات على GitHub تعطي الذكاء الاصطناعي ذوق في تصميم المواقع المواقع اللي يسويها الذكاء الاصطناعي كلها شكل واحد؟ مو ذنب النموذج بس، ناقصه أدوات تعطيه ذوق. سبع أدوات على GitHub تفرق: 1. Taste Skill: تخلي الوكيل يختار ستايل للتصميم، ويجيب صور من أرشيفات مفتوحة، ويراجع شغله بالمتصفح. Leonxlnx/taste-skill 2. Impeccable: ناقد تصميم، أوامر تنقد الواجهة وتزبّط التفاصيل. pbakaus/impeccable 3. Designlang: عطها رابط موقع يعجبك، تطلع لك ألوانه وخطوطه ومسافاته. Manavarya09/design-extract 4. React Bits: أكثر من 215 قطعة متحركة جاهزة. DavidHDev/react-bits 5. GSAP Skills: تعلّم الوكيل يحرك عناصر الموقع وانت تنزل بالصفحة. greensock/gsap-skills 6. Transitions.dev: حركات صغيرة للقوائم والبطاقات والتنبيهات. Jakubantalik/transitions.dev 7. Playwright CLI من مايكروسوفت: الوكيل يفتح المتصفح ويصوّر موقعه ويشوف مشاكله. microsoft/playwright-cli ابدأ بـTaste Skill أو Impeccable، عطها وكيلك وقل له: استخدمها وراجع النتيجة. (أعداد النجوم حسب GitHub بتاريخ 25 أكتوبر 2026) #ذكاء_اصطناعي #تصميم_مواقع #GitHub #برمجة #عبدالرحمن_AI

Taste Skill for Claude Code: Fix AI-Looking UI (100K GitHub Stars) Taste Skill gives coding agents art direction, reference images, and a browser check so apps stop looking AI-made. The repo has passed 100,000 GitHub stars. A good fit for the internal tools your team ships with Claude Code. Repo: Leonxlnx/taste-skill [ar] Taste Skill لـ Claude Code: أصلح واجهة المستخدم التي تبدو وكأنها من صنع الذكاء الاصطناعي (100 ألف... تُقدّم Taste Skill للمبرمجين توجيهات فنية، وصورًا مرجعية، وفحصًا للمتصفح، مما يضمن عدم ظهور التطبيقات بمظهر مُصمّم بواسطة الذكاء الاصطناعي. وقد تجاوز عدد نجوم هذا المشروع 100,000 نجمة على GitHub. يُعدّ هذا المشروع إضافةً قيّمةً للأدوات الداخلية التي يستخدمها فريقك مع Claude Code. رابط المشروع: Leonxlnx/taste-skill [bn] Claude Code-এর জন্য Taste Skill: AI-এর তৈরি UI ঠিক করুন (১০০ হাজার GitHub স্টার) টেস্ট স্কিল কোডিং এজেন্টদের আর্ট ডিরেকশন, রেফারেন্স ইমেজ এবং ব্রাউজার চেক প্রদান করে, যাতে অ্যাপগুলোকে আর এআই-নির্মিত বলে মনে না হয়। এই রিপোটি ১,০০,০০০ গিটহাব স্টার অতিক্রম করেছে। ক্লড কোড-এর সাথে আপনার টিম যে অভ্যন্তরীণ টুলগুলো সরবরাহ করে, সেগুলোর জন্য এটি একটি উপযুক্ত সমাধান। রিপো: Leonxlnx/taste-skill [de-DE] Taste Skill für Claude Code: KI-Design verbessern (100.000 GitHub-Sterne) Taste Skill bietet Programmierern visuelle Gestaltung, Referenzbilder und einen Browser-Check, damit ihre Apps nicht mehr wie von einer KI erstellt aussehen. Das Repository hat über 100.000 GitHub-Sterne erreicht. Ideal für die internen Tools, die Ihr Team mit Claude Code ausliefert. Repository: Leonxlnx/taste-skill [es-US] Taste Skill para Claude Code: Corrige la interfaz que parece hecha por IA (100 mil estrellas en G... Taste Skill proporciona a los desarrolladores dirección artística, imágenes de referencia y una comprobación del navegador para que las aplicaciones dejen de parecer creadas por IA. El repositorio ha superado las 100 000 estrellas en GitHub. Ideal para las herramientas internas que tu equipo distribuye con Claude Code. Repositorio: Leonxlnx/taste-skill [fr-FR] Taste Skill pour Claude Code : corrigez les interfaces qui font trop "IA" (100k étoiles GitHub) Taste Skill fournit aux développeurs une direction artistique, des images de référence et un outil de vérification de compatibilité navigateur pour que les applications ne paraissent pas artificielles. Ce dépôt a dépassé les 100 000 étoiles sur GitHub. Un complément idéal aux outils internes que votre équipe utilise avec Claude Code. Dépôt : Leonxlnx/taste-skill [hi] Claude Code के लिए Taste Skill: AI जैसा दिखने वाला UI ठीक करें (100K GitHub स्टार्स) Taste Skill कोडिंग एजेंटों को आर्ट डायरेक्शन, संदर्भ छवियां और ब्राउज़र चेक प्रदान करता है ताकि ऐप्स AI द्वारा निर्मित न दिखें। इस रिपॉजिटरी को GitHub पर 100,000 से अधिक स्टार मिल चुके हैं। यह आपकी टीम द्वारा Claude Code के साथ दिए जाने वाले आंतरिक टूल के लिए उपयुक्त है। रिपॉजिटरी: Leonxlnx/taste-skill [id] Taste Skill untuk Claude Code: Perbaiki UI yang Terlihat Seperti Buatan AI (100 Ribu Bintang GitHub) Taste Skill memberikan arahan artistik, gambar referensi, dan pengecekan browser kepada agen pengkodean sehingga aplikasi tidak terlihat seperti buatan AI. Repositori ini telah melampaui 100.000 bintang GitHub. Sangat cocok untuk alat internal yang tim Anda sertakan bersama Claude Code. Repositori: Leonxlnx/taste-skill [it] Taste Skill per Claude Code: correggi le interfacce che sembrano fatte dall'IA (100.000 stelle su... Taste Skill offre agli sviluppatori di software indicazioni artistiche, immagini di riferimento e un controllo del browser per evitare che le app sembrino create dall'IA. Il repository ha superato le 100.000 stelle su GitHub. Si integra perfettamente con gli strumenti interni che il tuo team utilizza con Claude Code. Repository: Leonxlnx/taste-skill [iw] Taste Skill עבור Claude Code: תיקון ממשק משתמש שנראה כמו AI (100 אלף כוכבים ב-GitHub) Taste Skill מעניקה לסוכני קידוד הנחיה אמנותית, תמונות עזר ובדיקת דפדפן כדי שאפליקציות יפסיקו להיראות עשויות מבינה מלאכותית. המאגר עבר את רף 100,000 כוכבי GitHub. התאמה טובה לכלים הפנימיים שהצוות שלכם מספק עם Claude Code. מאגר: Leonxlnx/taste-skill [ja] Claude CodeのTaste Skill：AIっぽさを解消するUI改善術（GitHubで10万スター獲得） Taste Skillは、コーディングエージェントにアートディレクション、参考画像、ブラウザチェック機能を提供し、アプリがAI製に見えないようにします。このリポジトリはGitHubで10万スター以上を獲得しています。 Claude Codeで配布している社内ツールに最適です。 リポジトリ：Leonxlnx/taste-skill [ko] Claude Code의 맛 평가 스킬: AI처럼 보이는 UI 수정 (GitHub 스타 10만 개 달성) Taste Skill은 코딩 에이전트에게 아트 디렉션, 참조 이미지, 브라우저 검사 기능을 제공하여 앱이 AI로 만들어진 것처럼 보이지 않도록 도와줍니다. 이 저장소는 GitHub에서 10만 개 이상의 스타를 획득했습니다. Claude Code와 함께 팀에서 배포하는 내부 도구에 적합합니다. 저장소: Leonxlnx/taste-skill [ml] Claude Code-നായി Taste Skill: AI രൂപത്തിലുള്ള UI ശരിയാക്കാം (1 ലക്ഷം GitHub സ്റ്റാറുകൾ) കോഡിംഗ് ഏജന്റുമാർക്ക് കലാസംവിധാനം, റഫറൻസ് ഇമേജുകൾ, ബ്രൗസർ പരിശോധന എന്നിവ നൽകുന്ന ടേസ്റ്റ് സ്കിൽ, ആപ്ലിക്കേഷനുകൾ AI-നിർമ്മിതമായി കാണപ്പെടുന്നത് നിർത്തുന്നു. റെപ്പോ 100,000 GitHub നക്ഷത്രങ്ങൾ പിന്നിട്ടു. ക്ലോഡ് കോഡ് ഉപയോഗിച്ച് നിങ്ങളുടെ ടീം അയയ്ക്കുന്ന ആന്തരിക ഉപകരണങ്ങൾക്ക് അനുയോജ്യം. റെപ്പോ: Leonxlnx/taste-skill [nl-NL] Taste Skill voor Claude Code: Los AI-achtige UI op (100K GitHub-sterren) Taste Skill biedt programmeurs artistieke begeleiding, referentieafbeeldingen en een browsercontrole, zodat apps er niet meer uitzien alsof ze door AI zijn gemaakt. De repository heeft meer dan 100.000 sterren op GitHub. Een goede aanvulling op de interne tools die je team gebruikt met Claude Code. Repository: Leonxlnx/taste-skill [pa] Claude Code ਲਈ Taste Skill: AI ਵਰਗੇ UI ਨੂੰ ਠੀਕ ਕਰੋ (100K GitHub ਸਟਾਰਸ) ਟੇਸਟ ਸਕਿੱਲ ਕੋਡਿੰਗ ਏਜੰਟਾਂ ਨੂੰ ਕਲਾ ਨਿਰਦੇਸ਼ਨ, ਸੰਦਰਭ ਚਿੱਤਰ, ਅਤੇ ਇੱਕ ਬ੍ਰਾਊਜ਼ਰ ਜਾਂਚ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ ਤਾਂ ਜੋ ਐਪਸ AI-ਬਣੇ ਦਿਖਣ ਤੋਂ ਰੁਕ ਜਾਣ। ਰੈਪੋ ਨੇ 100,000 GitHub ਸਟਾਰਾਂ ਨੂੰ ਪਾਰ ਕਰ ਲਿਆ ਹੈ। ਤੁਹਾਡੀ ਟੀਮ ਦੁਆਰਾ Claude Code ਨਾਲ ਭੇਜੇ ਗਏ ਅੰਦਰੂਨੀ ਟੂਲਸ ਲਈ ਇੱਕ ਵਧੀਆ ਫਿੱਟ। ਰੈਪੋ: Leonxlnx/taste-skill [pl] Taste Skill dla Claude Code: Napraw interfejsy wyglądające jak z AI (100 tys. gwiazdek na GitHubie) Taste Skill zapewnia programistom wskazówki dotyczące grafiki, obrazy referencyjne i weryfikację przeglądarki, dzięki czemu aplikacje nie wyglądają na stworzone przez sztuczną inteligencję. Repozytorium uzyskało ponad 100 000 gwiazdek na GitHubie. Dobrze pasuje do wewnętrznych narzędzi, które Twój zespół dostarcza z Claude Code. Repozytorium: Leonxlnx/taste-skill [pt-BR] Taste Skill para Claude Code: Corrija UIs com "cara de IA" (100 mil estrelas no GitHub) O Taste Skill fornece aos agentes de programação direção de arte, imagens de referência e uma verificação de navegador para que os aplicativos não pareçam feitos por IA. O repositório ultrapassou 100.000 estrelas no GitHub. Uma ótima opção para as ferramentas internas que sua equipe utiliza com o Claude Code. Repositório: Leonxlnx/taste-skill [ru] Taste Skill для Claude Code: исправляем «ИИ-дизайн» (100 тыс. звезд на GitHub) Taste Skill предоставляет программистам художественное оформление, эталонные изображения и проверку браузера, чтобы приложения не выглядели созданными с помощью ИИ. Репозиторий набрал более 100 000 звезд на GitHub. Отлично подходит для внутренних инструментов, которые ваша команда поставляет вместе с Claude Code. Репозиторий: Leonxlnx/taste-skill [ta] Claude Code-க்கான Taste Skill: AI போன்ற தோற்றமுள்ள UI-ஐ சரிசெய்யுங்கள் (1,00,000 GitHub நட்சத்திர... டேஸ்ட் ஸ்கில், கோடிங் ஏஜென்ட்களுக்கு கலை வழிகாட்டுதல், குறிப்புப் படங்கள் மற்றும் ஒரு பிரவுசர் சரிபார்ப்பை வழங்குகிறது. இதன் மூலம் செயலிகள் செயற்கை நுண்ணறிவால் உருவாக்கப்பட்டவை போலத் தோன்றுவதை நிறுத்துகிறது. இந்த ரெப்போ 100,000 கிட்ஹப் ஸ்டார்களைக் கடந்துள்ளது. கிளாட் கோட் உடன் உங்கள் குழு வழங்கும் உள்ளகக் கருவிகளுக்கு இது மிகவும் பொருத்தமானது. ரெப்போ: Leonxlnx/taste-skill [te] క్లాడ్ కోడ్ కోసం టేస్ట్ స్కిల్: AIలా కనిపించే UIని సరిచేయండి (100K GitHub స్టార్స్) టేస్ట్ స్కిల్ కోడింగ్ ఏజెంట్లకు ఆర్ట్ డైరెక్షన్, రిఫరెన్స్ ఇమేజ్‌లు మరియు బ్రౌజర్ చెక్‌ను అందిస్తుంది, తద్వారా యాప్‌లు AI-తయారు చేసినట్లుగా కనిపించడం ఆగిపోతుంది. ఈ రెపో 100,000 గిట్‌హబ్ స్టార్స్‌ను దాటింది. మీ బృందం క్లాడ్ కోడ్‌తో అందించే అంతర్గత సాధనాలకు ఇది చక్కగా సరిపోతుంది. రెపో: Leonxlnx/taste-skill [uk] Taste Skill для Claude Code: як виправити UI, що виглядає як «штучний» (100 тис. зірок на GitHub) Taste Skill надає агентам кодування художні вказівки, довідкові зображення та перевірку браузера, щоб програми не виглядали створеними штучним інтелектом. Репозиторій перевищив 100 000 зірок GitHub. Добре підходить для внутрішніх інструментів, які ваша команда постачає з Claude Code. Репозиторій: Leonxlnx/taste-skill

很干货！还有一点，用好 skill 也能事半功倍，本质上还是补充更多领域知识判断到上下文。 补几个经常用到的，欢迎尝试！ github.com/anthropics/claude-code/blob/main/plugi… Leonxlnx/taste-skill 通过这个检索方法可以找到适合自己的；topics/web-design t.co