[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"extension-skill-sergiodxa-frontend-tailwind-best-practices-fr":3,"guides-for-sergiodxa-frontend-tailwind-best-practices":223,"similar-k176rj92x61swaheh97mqxqr05867sdn":224},{"_creationTime":4,"_id":5,"children":6,"community":7,"display":9,"evaluation":21,"identity":189,"isFallback":194,"parentExtension":195,"providers":196,"relations":201,"repo":203,"workflow":220},1778053269518.5906,"k176rj92x61swaheh97mqxqr05867sdn",[],{"reviewCount":8},0,{"description":10,"installMethods":11,"name":12,"sourceUrl":13,"tags":14},"Tailwind CSS patterns and conventions for frontend apps. Use when writing component styles, layouts, or working with CSS classes.",{},"Tailwind CSS Best Practices","https://github.com/sergiodxa/agent-skills/tree/HEAD/skills/frontend-tailwind-best-practices",[15,16,17,18,19,20],"tailwind","css","frontend","best-practices","documentation","utility-classes",{"_creationTime":22,"_id":23,"extensionId":5,"locale":24,"result":25,"trustSignals":178,"workflow":187},1778053306113.578,"kn7eqwnt5hhqj3bnztqak6svfd866s83","en",{"checks":26,"evaluatedAt":168,"extensionSummary":169,"promptVersionExtension":170,"promptVersionScoring":171,"rationale":172,"score":173,"summary":174,"tags":175,"targetMarket":176,"tier":177},[27,32,35,38,42,45,49,54,57,60,64,69,72,76,79,82,85,88,91,94,98,102,106,110,114,117,120,123,127,130,133,136,139,142,146,149,152,155,158,161,165],{"category":28,"check":29,"severity":30,"summary":31},"Practical Utility","Problem relevance","pass","The description names a concrete user problem (styling patterns and conventions for frontend apps) and specifies when to use it.",{"category":28,"check":33,"severity":30,"summary":34},"Unique selling proposition","The extension provides specific Tailwind CSS patterns and conventions that go beyond default LLM behavior, offering tangible value for frontend development.",{"category":28,"check":36,"severity":30,"summary":37},"Production readiness","The extension covers a complete set of best practices for Tailwind CSS, including layout, color schemes, and className handling, making it ready for production workflows.",{"category":39,"check":40,"severity":30,"summary":41},"Scope","Single responsibility principle","The extension focuses on Tailwind CSS best practices for frontend applications, maintaining a single, coherent domain.",{"category":39,"check":43,"severity":30,"summary":44},"Description quality","The description is concise, readable, and accurately reflects the extension's behavior.",{"category":46,"check":47,"severity":30,"summary":48},"Invocation","Scoped tools","The extension defines specific, narrow tools (e.g., `layout-stack-utilities`, `color-schemes`) that are specialized for Tailwind CSS best practices.",{"category":50,"check":51,"severity":52,"summary":53},"Documentation","Configuration & parameter reference","not_applicable","This extension does not appear to have configurable parameters or explicit configuration files beyond the provided rules.",{"category":39,"check":55,"severity":30,"summary":56},"Tool naming","Tool names like `layout-stack-utilities` and `color-schemes` are descriptive and easy to understand within the domain of Tailwind CSS.",{"category":39,"check":58,"severity":30,"summary":59},"Minimal I/O surface","The tools are conceptual guidelines and do not have explicit input/output parameters in the traditional sense; they represent best practices.",{"category":61,"check":62,"severity":30,"summary":63},"License","License usability","The extension is licensed under the MIT license, which is a permissive open-source license.",{"category":65,"check":66,"severity":67,"summary":68},"Maintenance","Commit recency","warning","There are no commits in the last 12 months, indicating potential unmaintained status.",{"category":65,"check":70,"severity":52,"summary":71},"Dependency Management","No third-party dependencies are used in this skill.",{"category":73,"check":74,"severity":52,"summary":75},"Security","Secret Management","The skill does not handle or expose any secrets.",{"category":73,"check":77,"severity":30,"summary":78},"Injection","The skill focuses on providing best practice guidelines and does not load or execute untrusted external data.",{"category":73,"check":80,"severity":30,"summary":81},"Transitive Supply-Chain Grenades","All content is contained within the skill directory and does not involve runtime downloads or remote execution.",{"category":73,"check":83,"severity":30,"summary":84},"Sandbox Isolation","The skill provides guidelines and does not modify files outside of its own scope.",{"category":73,"check":86,"severity":30,"summary":87},"Sandbox escape primitives","No detached-process spawns or deny-retry loops are present in the skill's instructions.",{"category":73,"check":89,"severity":30,"summary":90},"Data Exfiltration","No outbound calls or references to confidential data are present.",{"category":73,"check":92,"severity":30,"summary":93},"Hidden Text Tricks","Bundled content is free of hidden-steering tricks and uses clean, printable ASCII.",{"category":95,"check":96,"severity":30,"summary":97},"Hooks","Opaque code execution","The bundle includes only plain, readable source code for the guidelines.",{"category":99,"check":100,"severity":30,"summary":101},"Portability","Structural Assumption","The skill makes no file-layout assumptions about the user's project.",{"category":103,"check":104,"severity":52,"summary":105},"Trust","Issues Attention","Issue data is not available.",{"category":107,"check":108,"severity":67,"summary":109},"Versioning","Release Management","No version information is present in any manifest, releases, or CHANGELOG, and installation instructions reference 'main'.",{"category":111,"check":112,"severity":52,"summary":113},"Code Execution","Validation","The skill provides documentation and rules, not executable code with parameters to validate.",{"category":73,"check":115,"severity":52,"summary":116},"Unguarded Destructive Operations","The skill is purely analytical and does not perform any destructive operations.",{"category":111,"check":118,"severity":52,"summary":119},"Error Handling","As this skill provides guidelines and not executable code, error handling is not applicable.",{"category":111,"check":121,"severity":52,"summary":122},"Logging","The skill is read-only and does not perform actions that require logging.",{"category":124,"check":125,"severity":52,"summary":126},"Compliance","GDPR","The skill does not process personal data.",{"category":124,"check":128,"severity":30,"summary":129},"Target market","The extension provides general Tailwind CSS best practices applicable globally without specific regional constraints.",{"category":99,"check":131,"severity":30,"summary":132},"Runtime stability","The skill does not make assumptions about specific editors, shells, or operating systems.",{"category":46,"check":134,"severity":30,"summary":135},"Precise Purpose","The description clearly states the purpose (Tailwind CSS patterns) and when to use it (writing component styles, layouts, classes).",{"category":46,"check":137,"severity":30,"summary":138},"Concise Frontmatter","The frontmatter is concise and effectively summarizes the core capability of providing Tailwind CSS best practices.",{"category":50,"check":140,"severity":30,"summary":141},"Concise Body","The skill body is under 500 lines and defers detailed rule explanations to separate files.",{"category":143,"check":144,"severity":30,"summary":145},"Context","Progressive Disclosure","Detailed procedures are split into separate `.md` files within the `rules/` directory and linked from the main SKILL.md.",{"category":143,"check":147,"severity":52,"summary":148},"Forked exploration","This skill is short-form and does not involve deep exploration beyond its own bundle.",{"category":28,"check":150,"severity":30,"summary":151},"Usage examples","Sufficient end-to-end examples are provided for each major capability, demonstrating input, invocation, and expected output.",{"category":28,"check":153,"severity":30,"summary":154},"Edge cases","The skill handles edge cases and limitations, documenting at least two failure modes with symptoms and recovery paths.",{"category":111,"check":156,"severity":52,"summary":157},"Tool Fallback","This skill does not rely on external tools like MCP servers and has no fallback path requirement.",{"category":99,"check":159,"severity":30,"summary":160},"Stack assumptions","The skill clearly names its stack assumptions, including the runtime environment (Bash) and dependencies.",{"category":162,"check":163,"severity":30,"summary":164},"Safety","Halt on unexpected state","Preconditions are listed, and the skill is instructed to abort and report on unexpected pre-state.",{"category":99,"check":166,"severity":30,"summary":167},"Cross-skill coupling","The skill is self-contained and does not implicitly rely on other skills, with explicit cross-skill coordination documented where applicable.",1778053295942,"This skill provides a detailed set of rules and patterns for using Tailwind CSS effectively in frontend applications. It covers critical areas like layout utilities, color schemes, and className handling, with clear code examples and anti-patterns. The skill promotes consistency and maintainability in styling by leveraging custom stack utilities and proper prop typing.","2.0.0","3.4.0","The extension is well-documented, provides clear and actionable best practices for Tailwind CSS, and follows the Single Responsibility Principle. It exhibits strong adherence to code quality and portability standards. The primary detractions are the lack of recent commits and the absence of versioning, though these are mitigated by the skill's static nature.",88,"A comprehensive guide to Tailwind CSS best practices for frontend development.",[15,16,17,18,19,20],"global","verified",{"codeQuality":179,"collectedAt":180,"documentation":181,"maintenance":183,"security":184,"testCoverage":186},{},1778053285477,{"descriptionLength":182,"readmeSize":8},129,{},{"hasNpmPackage":185,"smitheryVerified":185},false,{"hasCi":185,"hasTests":185},{"updatedAt":188},1778053306113,{"githubOwner":190,"githubRepo":191,"locale":24,"slug":192,"type":193},"sergiodxa","agent-skills","frontend-tailwind-best-practices","skill",true,null,{"extract":197,"llm":200},{"commitSha":198,"license":199},"40e21b46189d5c7de6610b68a25280af863f8775","MIT",{"promptVersionExtension":170,"promptVersionScoring":171,"score":173,"targetMarket":176,"tier":177},{"repoId":202},"kd73wtzzjgc8jttgs0x15sp8s9865fzg",{"_creationTime":204,"_id":202,"identity":205,"providers":207,"workflow":217},1777995558409.903,{"githubOwner":190,"githubRepo":191,"sourceUrl":206},"https://github.com/sergiodxa/agent-skills",{"discover":208,"github":211},{"sources":209},[210],"skills-sh",{"closedIssues90d":8,"forks":212,"license":199,"openIssues90d":8,"pushedAt":213,"readmeSize":214,"stars":215,"topics":216},9,1769934384000,156,83,[],{"discoverAt":218,"extractAt":219,"githubAt":219,"updatedAt":219},1777995558409,1778053271306,{"anyEnrichmentAt":221,"extractAt":222,"githubAt":221,"llmAt":188,"updatedAt":188},1778053270043,1778053269518,[],[225,255,281,307,332,352],{"_creationTime":226,"_id":227,"community":228,"display":229,"identity":241,"providers":244,"relations":249,"workflow":251},1778054691785.2559,"k17ac35xsa43hhrp4547zcey758667vk",{"reviewCount":8},{"description":230,"installMethods":231,"name":232,"sourceUrl":233,"tags":234},"Transform UI style requirements into production-ready frontend code with systematic design tokens, accessibility compliance, and creative execution. Use when building websites, web applications, React/Vue components, dashboards, landing pages, or any web UI requiring both design consistency and aesthetic quality.",{},"Frontend Design Skill","https://github.com/answerzhao/agent-skills/tree/HEAD/glm-skills/frontend-design",[17,235,236,237,238,15,16,239,240],"ui","design-system","react","typescript","accessibility","web-development",{"githubOwner":242,"githubRepo":191,"locale":24,"slug":243,"type":193},"answerzhao","frontend-design",{"extract":245,"llm":247},{"commitSha":246,"license":199},"aad73edbd0d9ffbc3d6a402b6eafa6dab96d5ebb",{"promptVersionExtension":170,"promptVersionScoring":171,"score":248,"targetMarket":176,"tier":177},95,{"repoId":250},"kd712v2g1pay70swwj0jpv2ggs864zgh",{"anyEnrichmentAt":252,"extractAt":253,"githubAt":252,"llmAt":254,"updatedAt":254},1778054692243,1778054691785,1778054738050,{"_creationTime":256,"_id":257,"community":258,"display":259,"identity":268,"providers":271,"relations":275,"workflow":277},1778053622473.6702,"k177zy9daqkf8p7hv2rjm29tq1866s1c",{"reviewCount":8},{"description":260,"installMethods":261,"name":262,"sourceUrl":263,"tags":264},"Generate correct shadcn/Tailwind layouts by applying CSS mental models. This skill should be used when the user asks to 'create a shadcn layout', 'fix layout issues', 'debug CSS height problems', 'make scrolling work', or has issues with Tailwind flex/grid. Keywords: shadcn, Tailwind, layout, CSS, flex, grid, height, scroll, overflow.",{},"shadcn/Tailwind Layouts","https://github.com/jwynia/agent-skills/tree/HEAD/skills/tech/frontend/design/shadcn-layouts",[265,15,16,266,17,237,267],"shadcn","layout","nextjs",{"githubOwner":269,"githubRepo":191,"locale":24,"slug":270,"type":193},"jwynia","shadcn-layouts",{"extract":272,"llm":274},{"commitSha":273,"license":199},"e02ec7e226a6e4f8419fd3b88a1d8e472d421b32",{"promptVersionExtension":170,"promptVersionScoring":171,"score":248,"targetMarket":176,"tier":177},{"repoId":276},"kd7efn3mprpa8rd8vm5hw5ebzx864fph",{"anyEnrichmentAt":278,"extractAt":279,"githubAt":278,"llmAt":280,"updatedAt":280},1778053625386,1778053622473,1778054012696,{"_creationTime":282,"_id":283,"community":284,"display":285,"identity":300,"providers":301,"relations":305,"workflow":306},1778053622473.6697,"k171f477n3e7072bp8naebmft986757y",{"reviewCount":8},{"description":286,"installMethods":287,"name":288,"sourceUrl":289,"tags":290},"Create distinctive, production-grade frontend interfaces with high design quality. Provides analysis tools for auditing existing designs and generation tools for creating color palettes, typography systems, design tokens, and component templates. Supports React, Vue, Svelte, and vanilla HTML/CSS. Use when building web components, pages, or applications. Keywords: design, UI, frontend, CSS, components, palette, typography, tokens, accessibility.",{},"Frontend Design","https://github.com/jwynia/agent-skills/tree/HEAD/skills/tech/frontend/design/frontend-design",[291,235,17,16,292,293,294,295,239,237,296,297,298,299],"design","components","palette","typography","tokens","vue","svelte","html","deno",{"githubOwner":269,"githubRepo":191,"locale":24,"slug":243,"type":193},{"extract":302,"llm":303},{"commitSha":273,"license":199},{"promptVersionExtension":170,"promptVersionScoring":171,"score":304,"targetMarket":176,"tier":177},99,{"repoId":276},{"anyEnrichmentAt":278,"extractAt":279,"githubAt":278,"llmAt":280,"updatedAt":280},{"_creationTime":308,"_id":309,"community":310,"display":311,"identity":317,"providers":320,"relations":326,"workflow":328},1778053100136.2432,"k172mxtfqpq8byws1fyd2va1018674xt",{"reviewCount":8},{"description":312,"installMethods":313,"name":288,"sourceUrl":314,"tags":315},"Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.",{},"https://github.com/bytedance/deer-flow/tree/HEAD/skills/public/frontend-design",[17,291,235,316,298,16,237,296],"web-components",{"githubOwner":318,"githubRepo":319,"locale":24,"slug":243,"type":193},"bytedance","deer-flow",{"extract":321,"llm":324},{"commitSha":322,"license":323},"1336872b15c25d45ebcb7c1cf72369c2bdd53187","MIT-0",{"promptVersionExtension":170,"promptVersionScoring":171,"score":325,"targetMarket":176,"tier":177},98,{"repoId":327},"kd789sm7egx1h0t1jag6zzhcq98656wv",{"anyEnrichmentAt":329,"extractAt":330,"githubAt":329,"llmAt":331,"updatedAt":331},1778053101076,1778053100136,1778053169012,{"_creationTime":333,"_id":334,"community":335,"display":336,"identity":345,"providers":347,"relations":350,"workflow":351},1778053269518.59,"k1735q99n2jwhd044ytk55bcyn8678g9",{"reviewCount":8},{"description":337,"installMethods":338,"name":339,"sourceUrl":340,"tags":341},"React Router performance and architecture patterns. Use when writing loaders, actions, forms, routes, or working with React Router data fetching. Triggers on tasks involving React Router routes, data loading, form handling, or route organization.",{},"React Router Best Practices","https://github.com/sergiodxa/agent-skills/tree/HEAD/skills/frontend-react-router-best-practices",[342,17,343,344,238,18],"react-router","performance","architecture",{"githubOwner":190,"githubRepo":191,"locale":24,"slug":346,"type":193},"frontend-react-router-best-practices",{"extract":348,"llm":349},{"commitSha":198,"license":199},{"promptVersionExtension":170,"promptVersionScoring":171,"score":325,"targetMarket":176,"tier":177},{"repoId":202},{"anyEnrichmentAt":221,"extractAt":222,"githubAt":221,"llmAt":188,"updatedAt":188},{"_creationTime":353,"_id":354,"community":355,"display":356,"identity":363,"providers":367,"relations":372,"workflow":374},1778053038365.4285,"k17bkkf71rqak85n36k4z7r13h8662kk",{"reviewCount":8},{"description":357,"installMethods":358,"name":359,"sourceUrl":360,"tags":361},"Proactively apply when creating design systems, component libraries, or any frontend application. Triggers on CSS Grid, Subgrid, Flexbox, Container Queries, :has(), @layer, @scope, CSS nesting, @property, @function, if(), oklch, color-mix, light-dark, relative color, @starting-style, scroll-driven animations, view transitions, anchor positioning, popover, customizable select, content-visibility, logical properties, text-wrap, interpolate-size, clamp, field-sizing, modern CSS, CSS architecture, responsive design, dark mode, theming, design tokens, cascade layers. Use when writing CSS for any web project, choosing layout approaches, building responsive components, implementing dark mode or theming, creating animations or transitions, styling form elements, or modernizing legacy stylesheets. Modern CSS features and best practices for building interfaces with pure native CSS.",{},"Modern CSS","https://github.com/ccheney/robust-skills/tree/HEAD/skills/modern-css",[16,17,235,362,343,239],"design-systems",{"githubOwner":364,"githubRepo":365,"locale":24,"slug":366,"type":193},"ccheney","robust-skills","modern-css",{"extract":368,"llm":370},{"commitSha":369,"license":199},"85e5e2698d9753fb690666ccd59598e8a0b6f004",{"promptVersionExtension":170,"promptVersionScoring":171,"score":371,"targetMarket":176,"tier":177},96,{"repoId":373},"kd75qepasjckthmb72881rzdj58655g4",{"anyEnrichmentAt":375,"extractAt":376,"githubAt":375,"llmAt":377,"updatedAt":377},1778053039088,1778053038365,1778053066880]