[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6H7Q259ZPJEGDH15D71TPCC":3,"skill-same:01M6H7Q259ZPJEGDH15D71TPCC":62},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":18,"publishedAt":30,"linkOnly":31,"markdownContent":32,"markdownBody":33,"frontMatter":34,"refName":40,"commitSha":41,"skillDirectory":42,"forksCount":43,"repositoryHtmlUrl":44,"repositoryHomepageUrl":6,"ownerHtmlUrl":45,"ownerBlogUrl":46,"ownerDescription":6,"updatedAt":47,"install":48,"resources":61},"01M6H7Q259ZPJEGDH15D71TPCC","tailwind-expert",null,"Use when implementing tailwind functionality with production-grade patterns and safeguards.","0xharryriddle\u002Fcodex-field-kit","0xharryriddle","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F100945007?v=4","01M6H686JV0QKZYP2RWG6B2B8T","harryriddle","01M6H686PVZ8JGKWEG7B3GM5PD",3,"MIT","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills-hermes\u002Fcodex-agents\u002Ftailwind-expert\u002FSKILL.md",[],[19,20,21,22,23,24,25,26,27,28,29],"Tailwind","expert","tailwind expert","codex","Production","use","general","patterns","with","kit","implementing","2026-11-10 10:12:30",false,"---\nname: tailwind-expert\ndescription: Use when implementing tailwind functionality with production-grade patterns and safeguards.\nmetadata:\n  hermes:\n    tags: [codex-agent, general]\n    source: codex-field-kit\u002Fgeneral\n---\n\n# Tailwind Expert\n\n## Focus Areas\n- Understanding the utility-first approach of Tailwind\n- Customizing Tailwind configuration for specific projects\n- Leveraging Tailwind's responsive design capabilities\n- Utilizing Tailwind's typographic utilities effectively\n- Implementing custom themes with Tailwind\n- Integrating Tailwind with CSS processors like PostCSS\n- Managing design tokens with Tailwind\n- Rapid prototyping with Tailwind's utility classes\n- Optimizing Tailwind for large-scale applications\n- Adopting Tailwind best practices for maintainable code\n\n## Approach\n- Begin by exploring Tailwind's extensive utility classes\n- Customize Tailwind's default theme for project-specific needs\n- Use Tailwind's responsive grid system for layout\n- Simplify styling through Tailwind's built-in utilities\n- Manage component spacing with Tailwind's margin and padding utilities\n- Ensure performance with PurgeCSS to remove unused styles\n- Enhance component appearance with Tailwind's shadow utilities\n- Optimize typography with Tailwind's font utility classes\n- Leverage Tailwind's color palette for consistent design\n- Adopt atomic design principles using Tailwind classes\n\n## Quality Checklist\n- Tailwind configuration is tailored to project needs\n- Responsive design is thoroughly tested across devices\n- Consistent use of spacing and typography utilities\n- Style clashes are minimized with proper utility usage\n- Tailwind's design tokens are effectively managed\n- Unused styles are purged for optimal performance\n- Code readability is maintained with clear class organization\n- Tailwind updates are smoothly integrated into the workflow\n- Cross-browser compatibility is ensured with Tailwind utilities\n- API and documentation are referenced for best practices\n\n## Output\n- Styled components utilizing Tailwind's utility classes\n- Responsive layouts implemented with Tailwind's grid system\n- Consistent design theme across the application\n- Optimized CSS output by purging unused styles\n- Style guides using Tailwind's default and extended themes\n- Comprehensive documentation for Tailwind usage in the project\n- Scalable and maintainable CSS codebase with Tailwind\n- Thoroughly tested responsive design with Tailwind breakpoints\n- Efficient and readable code adhering to Tailwind's principles\n- Pre-configured Tailwind setup ready for further customization\n\n","# Tailwind Expert\n\n## Focus Areas\n- Understanding the utility-first approach of Tailwind\n- Customizing Tailwind configuration for specific projects\n- Leveraging Tailwind's responsive design capabilities\n- Utilizing Tailwind's typographic utilities effectively\n- Implementing custom themes with Tailwind\n- Integrating Tailwind with CSS processors like PostCSS\n- Managing design tokens with Tailwind\n- Rapid prototyping with Tailwind's utility classes\n- Optimizing Tailwind for large-scale applications\n- Adopting Tailwind best practices for maintainable code\n\n## Approach\n- Begin by exploring Tailwind's extensive utility classes\n- Customize Tailwind's default theme for project-specific needs\n- Use Tailwind's responsive grid system for layout\n- Simplify styling through Tailwind's built-in utilities\n- Manage component spacing with Tailwind's margin and padding utilities\n- Ensure performance with PurgeCSS to remove unused styles\n- Enhance component appearance with Tailwind's shadow utilities\n- Optimize typography with Tailwind's font utility classes\n- Leverage Tailwind's color palette for consistent design\n- Adopt atomic design principles using Tailwind classes\n\n## Quality Checklist\n- Tailwind configuration is tailored to project needs\n- Responsive design is thoroughly tested across devices\n- Consistent use of spacing and typography utilities\n- Style clashes are minimized with proper utility usage\n- Tailwind's design tokens are effectively managed\n- Unused styles are purged for optimal performance\n- Code readability is maintained with clear class organization\n- Tailwind updates are smoothly integrated into the workflow\n- Cross-browser compatibility is ensured with Tailwind utilities\n- API and documentation are referenced for best practices\n\n## Output\n- Styled components utilizing Tailwind's utility classes\n- Responsive layouts implemented with Tailwind's grid system\n- Consistent design theme across the application\n- Optimized CSS output by purging unused styles\n- Style guides using Tailwind's default and extended themes\n- Comprehensive documentation for Tailwind usage in the project\n- Scalable and maintainable CSS codebase with Tailwind\n- Thoroughly tested responsive design with Tailwind breakpoints\n- Efficient and readable code adhering to Tailwind's principles\n- Pre-configured Tailwind setup ready for further customization\n\n",{"name":5,"metadata":35,"description":7},{"hermes":36},{"tags":37,"source":39},[38,25],"codex-agent","codex-field-kit\u002Fgeneral","main","6c13f6f4ac5a3bc1e6b78cd2bb1704f122c4a73e","skills-hermes\u002Fcodex-agents\u002Ftailwind-expert",0,"https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit","https:\u002F\u002Fgithub.com\u002F0xharryriddle","https:\u002F\u002Fharryriddle.vercel.app","2026-04-11 11:49:51",{"source":8,"skillName":5,"commands":49,"prompt":59,"zipAvailable":60},[50,53,56],{"tool":51,"command":52},"npx","npx skills add 0xharryriddle\u002Fcodex-field-kit --skill tailwind-expert",{"tool":54,"command":55},"bunx","bunx skills add 0xharryriddle\u002Fcodex-field-kit --skill tailwind-expert",{"tool":57,"command":58},"pnpm","pnpm dlx skills add 0xharryriddle\u002Fcodex-field-kit --skill tailwind-expert","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills-hermes\u002Fcodex-agents\u002Ftailwind-expert\u002FSKILL.md",true,[],[63,95,114,124,149,176],{"skillNo":64,"name":65,"nameZh":6,"description":66,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":67,"categories":68,"keywords":74,"publishedAt":30},"01M6H7ZKE6MR33HC84QZ1TA6MV","vercel-react-best-practices","React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React\u002FNext.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Fvercel-react-best-practices\u002FSKILL.md",[69],{"categoryNo":70,"categoryName":71,"taxonomyType":72,"taxonomyTypeDesc":73},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",[75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94],"react best practices","react","vercel react best practices","best practices","vercel","tasks","data fetching","triggers","pages","next","performance optimization","refactoring","Next.js","Optimization","code","guidelines","react components","components","performance","writing",{"skillNo":96,"name":97,"nameZh":6,"description":98,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":99,"categories":100,"keywords":101,"publishedAt":30},"01M6H7ZGC2WK8SEKYHWDNTMDA9","swarm-planner","[EXPLICIT INVOCATION ONLY] Creates dependency-aware implementation plans optimized for parallel multi-agent execution.","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Fswarm-planner\u002FSKILL.md",[],[102,103,104,105,106,107,108,109,110,111,112,113],"swarm","swarm planner","planner","parallel","multi-agent","only","execution","plans","dependency","for","multi","implementation",{"skillNo":115,"name":116,"nameZh":6,"description":117,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":118,"categories":119,"keywords":120,"publishedAt":30},"01M6H7ZD93853RZCYQWH1D38TM","super-swarm-spark","Only to be triggered by explicit super-swarm-spark commands.","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Fsuper-swarm-spark\u002FSKILL.md",[],[121,102,122,107,123],"super swarm spark","spark","commands",{"skillNo":125,"name":126,"nameZh":6,"description":127,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":128,"categories":129,"keywords":130,"publishedAt":30},"01M6H7Z987QBY49JCCPT953EAZ","role-creator","Create and install Codex custom agent roles in ~\u002F.codex\u002Fconfig.toml, generate role config files, enforce supported keys, and guide users through required role inputs (model, reasoning effort, developer_instructions).","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Frole-creator\u002FSKILL.md",[],[131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,22,148],"role","creator","role creator","keys","users","roles","toml","enforce","install","guide","instructions","model","developer","reasoning","generate","create","config","files",{"skillNo":150,"name":151,"nameZh":6,"description":152,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":153,"categories":154,"keywords":158,"publishedAt":30},"01M6H7Z5TRPMDQ7YSZQXPN1G60","read-github","Read and search GitHub repository documentation via gitmcp.io MCP service.\n\n**WHEN TO USE:**\n- User provides a GitHub URL\n- User mentions a specific repo in owner\u002Frepo format\n- User asks \"what does this repo do?\", \"read the docs for X repo\", or similar\n- User wants to search code or docs within a repo","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Fread-github\u002FSKILL.md",[155],{"categoryNo":156,"categoryName":157,"taxonomyType":72,"taxonomyTypeDesc":73},"01JBSEEDCAT000000000000023","Skill与智能体开发",[159,160,161,89,162,163,164,165,111,166,167,168,169,170,171,24,172,173,174,175],"github","read github","read","documentation","docs","MCP","search","when to use","URL","via","io","service","do","user","repo","format","repository",{"skillNo":177,"name":104,"nameZh":6,"description":178,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":179,"categories":180,"keywords":181,"publishedAt":30},"01M6H7Z215CTKYJ4Y1X6EQWN6M","Create comprehensive, phased implementation plans with sprints and atomic tasks. Use when user says: \"make a plan\", \"create a plan\", \"plan this out\", \"plan the implementation\", \"help me plan\", \"design a plan\", \"draft a plan\", \"write a plan\", \"outline the steps\", \"break this down into tasks\", \"what's the plan for\", or any similar planning request. Also triggers on explicit \"\u002Fplanner\" or \"\u002Fplan\" commands.","https:\u002F\u002Fgithub.com\u002F0xharryriddle\u002Fcodex-field-kit\u002Fblob\u002Fmain\u002Fskills\u002Fplanner\u002FSKILL.md",[],[104,182,111,183,27,184,82,109,123,185,186,24,187,188,189,190,191,146,80,192],"outline","atomic","sprints","draft","me","write","phased implementation","plan","help","planning","design"]