[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"extension-skill-ccheney-modern-css-ms":3,"guides-for-ccheney-modern-css":232,"similar-k17bkkf71rqak85n36k4z7r13h8662kk":233},{"_creationTime":4,"_id":5,"children":6,"community":7,"display":9,"evaluation":21,"identity":185,"isFallback":190,"parentExtension":191,"providers":192,"relations":197,"repo":199,"workflow":229},1778053038365.4285,"k17bkkf71rqak85n36k4z7r13h8662kk",[],{"reviewCount":8},0,{"description":10,"installMethods":11,"name":12,"sourceUrl":13,"tags":14},"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",[15,16,17,18,19,20],"css","frontend","ui","design-systems","performance","accessibility",{"_creationTime":22,"_id":23,"extensionId":5,"locale":24,"result":25,"trustSignals":174,"workflow":183},1778053066880.497,"kn75w6kyhdycxm7h08r3p3mkn1867r13","en",{"checks":26,"evaluatedAt":164,"extensionSummary":165,"promptVersionExtension":166,"promptVersionScoring":167,"rationale":168,"score":169,"summary":170,"tags":171,"targetMarket":172,"tier":173},[27,32,35,38,42,45,49,52,56,60,64,67,70,74,78,82,86,90,93,97,100,103,106,109,112,115,119,122,126,130,133,136,139,142,146,149,152,155,158,161],{"category":28,"check":29,"severity":30,"summary":31},"Practical Utility","Problem relevance","pass","The description clearly states the problem space (design systems, CSS architecture) and the user intent (writing CSS, choosing layouts, building components) with a comprehensive list of modern CSS features.",{"category":28,"check":33,"severity":30,"summary":34},"Unique selling proposition","The extension covers a wide array of modern CSS features and patterns, offering significant value beyond basic CSS knowledge by providing structured guidance and examples for complex CSS architecture and capabilities.",{"category":28,"check":36,"severity":30,"summary":37},"Production readiness","The extension provides comprehensive guidance on modern CSS features, including best practices, anti-patterns, and progressive enhancement strategies, making it suitable for use in production workflows.",{"category":39,"check":40,"severity":30,"summary":41},"Scope","Single responsibility principle","The extension focuses exclusively on modern CSS features and best practices for building user interfaces, maintaining a clear and singular domain.",{"category":39,"check":43,"severity":30,"summary":44},"Description quality","The description is comprehensive, well-organized, and accurately reflects the content and scope of the modern CSS features covered by the extension.",{"category":46,"check":47,"severity":30,"summary":48},"Invocation","Precise Purpose","The description clearly states the extension's purpose: to guide users on modern CSS features and best practices. It lists specific features and scenarios for use, indicating what it does and when to use it.",{"category":46,"check":50,"severity":30,"summary":51},"Concise Frontmatter","The frontmatter concisely summarizes the extension's core capability (modern CSS for interfaces) and lists trigger phrases effectively.",{"category":53,"check":54,"severity":30,"summary":55},"Documentation","Concise Body","The SKILL.md and associated reference files are well-organized, with key concepts in the main file and detailed information deferred to references, adhering to progressive disclosure.",{"category":57,"check":58,"severity":30,"summary":59},"Context","Progressive Disclosure","The extension effectively uses progressive disclosure by outlining core concepts in SKILL.md and linking to detailed explanations in separate reference files for each major CSS topic.",{"category":57,"check":61,"severity":62,"summary":63},"Forked exploration","not_applicable","This skill does not involve deep exploration or multi-file inspection that would necessitate setting `context: fork`.",{"category":28,"check":65,"severity":30,"summary":66},"Usage examples","The extension provides numerous clear examples, including CSS code snippets and explanations for modern features, often contrasting legacy vs. modern approaches, which plausibly produce the claimed outcomes.",{"category":28,"check":68,"severity":30,"summary":69},"Edge cases","The extension addresses edge cases and anti-patterns, such as the correct use of `prefers-reduced-motion`, feature detection with `@supports`, and the limitations of `content-visibility`.",{"category":71,"check":72,"severity":62,"summary":73},"Code Execution","Tool Fallback","The extension does not reference external tools like MCP servers; it directly provides CSS knowledge and patterns.",{"category":75,"check":76,"severity":62,"summary":77},"Safety","Halt on unexpected state","The extension provides CSS guidelines and does not involve scripts or execution that would have unexpected states.",{"category":79,"check":80,"severity":62,"summary":81},"Portability","Cross-skill coupling","The extension is self-contained and does not rely on or implicitly couple with other skills.",{"category":83,"check":84,"severity":30,"summary":85},"License","License usability","The repository includes a LICENSE file with the MIT license, which is a permissive open-source license.",{"category":87,"check":88,"severity":62,"summary":89},"Maintenance","Commit recency","Commit data is not available for this check, but the MIT license indicates a structure typical of actively maintained projects.",{"category":87,"check":91,"severity":62,"summary":92},"Dependency Management","The extension is a collection of CSS knowledge and does not appear to have third-party dependencies.",{"category":94,"check":95,"severity":62,"summary":96},"Security","Secret Management","The extension deals with CSS and does not handle or require secrets.",{"category":94,"check":98,"severity":30,"summary":99},"Injection","The extension provides CSS code and documentation, not executable code that loads untrusted third-party data.",{"category":94,"check":101,"severity":30,"summary":102},"Transitive Supply-Chain Grenades","The extension's content is self-contained CSS and documentation, with no runtime downloads or external code execution.",{"category":94,"check":104,"severity":62,"summary":105},"Sandbox Isolation","The extension provides CSS rules and documentation; it does not involve scripts or file operations that require sandbox isolation.",{"category":94,"check":107,"severity":62,"summary":108},"Sandbox escape primitives","The extension does not contain scripts or code that could be used for sandbox escapes.",{"category":94,"check":110,"severity":62,"summary":111},"Data Exfiltration","The extension provides CSS and documentation, with no outbound calls or mechanisms for data exfiltration.",{"category":94,"check":113,"severity":30,"summary":114},"Hidden Text Tricks","The bundled files appear to be free of hidden-steering tricks, control characters, or obfuscated content.",{"category":116,"check":117,"severity":62,"summary":118},"Hooks","Opaque code execution","The extension does not contain any scripts or code that could be considered opaque execution.",{"category":79,"check":120,"severity":62,"summary":121},"Structural Assumption","The extension provides CSS guidelines and does not make assumptions about the user's project file layout.",{"category":123,"check":124,"severity":62,"summary":125},"Trust","Issues Attention","No issue data is available for evaluation.",{"category":127,"check":128,"severity":62,"summary":129},"Versioning","Release Management","No explicit versioning information (manifest version, releases, changelog) was found in the provided metadata or files.",{"category":71,"check":131,"severity":62,"summary":132},"Validation","The extension provides CSS and does not involve executable code or structured output that requires validation libraries.",{"category":94,"check":134,"severity":62,"summary":135},"Unguarded Destructive Operations","The extension provides CSS guidelines and does not contain or perform any destructive operations.",{"category":71,"check":137,"severity":62,"summary":138},"Error Handling","The extension provides CSS and documentation, not executable code with error handling concerns.",{"category":71,"check":140,"severity":62,"summary":141},"Logging","The extension provides CSS and documentation, with no executable code that would require logging.",{"category":143,"check":144,"severity":62,"summary":145},"Compliance","GDPR","The extension deals with CSS and does not operate on personal data.",{"category":143,"check":147,"severity":30,"summary":148},"Target market","The extension provides general CSS best practices and features applicable to web development globally, with no specific regional constraints detected.",{"category":79,"check":150,"severity":30,"summary":151},"Runtime stability","The extension provides CSS rules and explanations, which are universally supported by modern browsers and do not assume specific runtimes or OS features.",{"category":39,"check":153,"severity":62,"summary":154},"Tool naming","The extension does not expose specific tools or commands; it provides CSS knowledge.",{"category":39,"check":156,"severity":62,"summary":157},"Minimal I/O surface","The extension provides CSS and documentation, not tools with input/output parameters.",{"category":53,"check":159,"severity":62,"summary":160},"Configuration & parameter reference","The extension does not expose configurable parameters or options that require documentation.",{"category":39,"check":162,"severity":62,"summary":163},"Scoped tools","The extension does not expose tools or commands.",1778053050761,"This extension provides in-depth explanations and practical examples for advanced CSS features like Grid, Subgrid, Container Queries, `:has()`, `@layer`, `:is()/:where()`, scroll-driven animations, and `@property`. It emphasizes modern syntax, accessibility, performance optimizations, and patterns for building robust, maintainable stylesheets and design systems.","2.0.0","3.4.0","The 'modern-css' extension is highly comprehensive, covering a vast range of modern CSS features with excellent explanations, examples, and progressive enhancement strategies. It adheres to best practices, promotes accessibility, and is well-structured using progressive disclosure. The MIT license is included. The only minor detraction is the lack of explicit versioning data.",96,"A comprehensive and well-documented guide to modern CSS features, best practices, and design system primitives.",[15,16,17,18,19,20],"global","verified",{"codeQuality":175,"collectedAt":176,"documentation":177,"maintenance":179,"security":180,"testCoverage":182},{},1778053042426,{"descriptionLength":178,"readmeSize":8},884,{},{"hasNpmPackage":181,"smitheryVerified":181},false,{"hasCi":181,"hasTests":181},{"updatedAt":184},1778053066880,{"githubOwner":186,"githubRepo":187,"locale":24,"slug":188,"type":189},"ccheney","robust-skills","modern-css","skill",true,null,{"extract":193,"llm":196},{"commitSha":194,"license":195},"85e5e2698d9753fb690666ccd59598e8a0b6f004","MIT",{"promptVersionExtension":166,"promptVersionScoring":167,"score":169,"targetMarket":172,"tier":173},{"repoId":198},"kd75qepasjckthmb72881rzdj58655g4",{"_creationTime":200,"_id":198,"identity":201,"providers":203,"workflow":226},1777995558409.881,{"githubOwner":186,"githubRepo":187,"sourceUrl":202},"https://github.com/ccheney/robust-skills",{"discover":204,"github":207},{"sources":205},[206],"skills-sh",{"closedIssues90d":208,"forks":8,"license":195,"openIssues90d":8,"pushedAt":209,"readmeSize":210,"stars":211,"topics":212},1,1777303392000,3972,39,[213,214,215,216,217,218,219,220,221,222,223,224,225],"agent-skills","skills","clean-architecture","domain-driven-design","drizzle-orm","feature-sliced-design","hexagonal-architecture","mermaid-diagrams","postgres","modern-javascript","slack-block-kit","slack-work-objects","slack-mrkdwn",{"discoverAt":227,"extractAt":228,"githubAt":228,"updatedAt":228},1777995558409,1778053039734,{"anyEnrichmentAt":230,"extractAt":231,"githubAt":230,"llmAt":184,"updatedAt":184},1778053039088,1778053038365,[],[234,268,295,320,345,368],{"_creationTime":235,"_id":236,"community":237,"display":238,"identity":254,"providers":257,"relations":262,"workflow":264},1778053622473.6697,"k171f477n3e7072bp8naebmft986757y",{"reviewCount":8},{"description":239,"installMethods":240,"name":241,"sourceUrl":242,"tags":243},"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",[244,17,16,15,245,246,247,248,20,249,250,251,252,253],"design","components","palette","typography","tokens","react","vue","svelte","html","deno",{"githubOwner":255,"githubRepo":213,"locale":24,"slug":256,"type":189},"jwynia","frontend-design",{"extract":258,"llm":260},{"commitSha":259,"license":195},"e02ec7e226a6e4f8419fd3b88a1d8e472d421b32",{"promptVersionExtension":166,"promptVersionScoring":167,"score":261,"targetMarket":172,"tier":173},99,{"repoId":263},"kd7efn3mprpa8rd8vm5hw5ebzx864fph",{"anyEnrichmentAt":265,"extractAt":266,"githubAt":265,"llmAt":267,"updatedAt":267},1778053625386,1778053622473,1778054012696,{"_creationTime":269,"_id":270,"community":271,"display":272,"identity":282,"providers":284,"relations":289,"workflow":291},1778054691785.2559,"k17ac35xsa43hhrp4547zcey758667vk",{"reviewCount":8},{"description":273,"installMethods":274,"name":275,"sourceUrl":276,"tags":277},"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",[16,17,278,249,279,280,15,20,281],"design-system","typescript","tailwind","web-development",{"githubOwner":283,"githubRepo":213,"locale":24,"slug":256,"type":189},"answerzhao",{"extract":285,"llm":287},{"commitSha":286,"license":195},"aad73edbd0d9ffbc3d6a402b6eafa6dab96d5ebb",{"promptVersionExtension":166,"promptVersionScoring":167,"score":288,"targetMarket":172,"tier":173},95,{"repoId":290},"kd712v2g1pay70swwj0jpv2ggs864zgh",{"anyEnrichmentAt":292,"extractAt":293,"githubAt":292,"llmAt":294,"updatedAt":294},1778054692243,1778054691785,1778054738050,{"_creationTime":296,"_id":297,"community":298,"display":299,"identity":305,"providers":308,"relations":314,"workflow":316},1778053100136.2432,"k172mxtfqpq8byws1fyd2va1018674xt",{"reviewCount":8},{"description":300,"installMethods":301,"name":241,"sourceUrl":302,"tags":303},"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",[16,244,17,304,252,15,249,250],"web-components",{"githubOwner":306,"githubRepo":307,"locale":24,"slug":256,"type":189},"bytedance","deer-flow",{"extract":309,"llm":312},{"commitSha":310,"license":311},"1336872b15c25d45ebcb7c1cf72369c2bdd53187","MIT-0",{"promptVersionExtension":166,"promptVersionScoring":167,"score":313,"targetMarket":172,"tier":173},98,{"repoId":315},"kd789sm7egx1h0t1jag6zzhcq98656wv",{"anyEnrichmentAt":317,"extractAt":318,"githubAt":317,"llmAt":319,"updatedAt":319},1778053101076,1778053100136,1778053169012,{"_creationTime":321,"_id":322,"community":323,"display":324,"identity":332,"providers":335,"relations":339,"workflow":341},1778054491434.2573,"k17akerbcb9qg85yjeq5b9a0fd8672fp",{"reviewCount":8},{"description":325,"installMethods":326,"name":327,"sourceUrl":328,"tags":329},"Design engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover states, shadows, borders, typography, micro-interactions, enter/exit animations, or any visual detail work. Triggers on UI polish, design details, \"make it feel better\", \"feels off\", stagger animations, border radius, optical alignment, font smoothing, tabular numbers, image outlines, box shadows.",{},"Make Interfaces Feel Better","https://github.com/jakubkrehel/make-interfaces-feel-better/tree/HEAD/skills/make-interfaces-feel-better",[17,244,16,15,330,247,331],"animation","polish",{"githubOwner":333,"githubRepo":334,"locale":24,"slug":334,"type":189},"jakubkrehel","make-interfaces-feel-better",{"extract":336,"llm":338},{"commitSha":337,"license":195},"384562064fcdd99778fcbafd8729626fe6aab02f",{"promptVersionExtension":166,"promptVersionScoring":167,"score":288,"targetMarket":172,"tier":173},{"repoId":340},"kd73vz76v1h3vbkcs55q5pr89s8640jq",{"anyEnrichmentAt":342,"extractAt":343,"githubAt":342,"llmAt":344,"updatedAt":344},1778054491631,1778054491434,1778054509344,{"_creationTime":346,"_id":347,"community":348,"display":349,"identity":356,"providers":358,"relations":362,"workflow":364},1778054425877.205,"k1788s1zmn7ntdbw621xdwznvx8664ht",{"reviewCount":8},{"description":350,"installMethods":351,"name":352,"sourceUrl":353,"tags":354},"Brand checking of React Elements.",{},"react-is","https://github.com/facebook/react/tree/HEAD/packages/react-is",[249,355,16,17],"javascript",{"githubOwner":357,"githubRepo":249,"locale":24,"slug":352,"type":189},"facebook",{"extract":359,"llm":361},{"commitSha":360,"license":195},"9635257c1b557acc81f95b1e974a54c752e703a2",{"promptVersionExtension":166,"promptVersionScoring":167,"score":313,"targetMarket":172,"tier":173},{"repoId":363},"kd73v9dy7vwq94hgzc7eh43b9s865rhq",{"anyEnrichmentAt":365,"extractAt":366,"githubAt":365,"llmAt":367,"updatedAt":367},1778054428301,1778054425877,1778054588390,{"_creationTime":369,"_id":370,"community":371,"display":372,"identity":381,"providers":384,"relations":388,"workflow":390},1778053269518.59,"k1735q99n2jwhd044ytk55bcyn8678g9",{"reviewCount":8},{"description":373,"installMethods":374,"name":375,"sourceUrl":376,"tags":377},"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",[378,16,19,379,279,380],"react-router","architecture","best-practices",{"githubOwner":382,"githubRepo":213,"locale":24,"slug":383,"type":189},"sergiodxa","frontend-react-router-best-practices",{"extract":385,"llm":387},{"commitSha":386,"license":195},"40e21b46189d5c7de6610b68a25280af863f8775",{"promptVersionExtension":166,"promptVersionScoring":167,"score":313,"targetMarket":172,"tier":173},{"repoId":389},"kd73wtzzjgc8jttgs0x15sp8s9865fzg",{"anyEnrichmentAt":391,"extractAt":392,"githubAt":391,"llmAt":393,"updatedAt":393},1778053270043,1778053269518,1778053306113]