[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M754PPSA4DCNETPQXY74KFEF":3,"skill-same:01M754PPSA4DCNETPQXY74KFEF":76},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":17,"publishedAt":18,"linkOnly":19,"markdownContent":20,"markdownBody":21,"frontMatter":22,"refName":24,"commitSha":25,"skillDirectory":26,"forksCount":27,"repositoryHtmlUrl":28,"repositoryHomepageUrl":6,"ownerHtmlUrl":29,"ownerBlogUrl":6,"ownerDescription":30,"updatedAt":31,"install":32,"resources":45},"01M754PPSA4DCNETPQXY74KFEF","codex-design-system",null,"Use for UI, frontend, styling, landing page, or component creation; injects palettes, typography, layouts, motion, and anti-generic design rules.","Bang-isme\u002FAgencyCLI","Bang-isme","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F179383529?v=4","01M754NDM8K05SAX2V31R63WEE","01M754NDMV48ECFT4HY6X2CKQ0",2,"MIT","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002FSKILL.md",[],[],"2026-11-12 13:55:43",false,"---\nname: codex-design-system\ndescription: Use for UI, frontend, styling, landing page, or component creation; injects palettes, typography, layouts, motion, and anti-generic design rules.\nload_priority: on-demand\n---\n\n## TL;DR\nLoad before any UI\u002Ffrontend task. This skill brings 30 palettes, 21 free font pairings, 20 layout patterns, 15 micro-interactions, composition rules, current trends, and developer-UI anti-pattern fixes. Anti-generic rules: no default blue, no plain white card stacks, no bootstrap look.\n\n## Activation\n1. Activate when task involves UI, frontend, styling, component work, or landing-page creation.\n2. Activate on `$design` or \"make it look premium\u002Fmodern\u002Fcreative\".\n3. Auto-load when `frontend-specialist` agent is active.\n4. Pair with `codex-design-md` when the project needs a durable `DESIGN.md` contract or token export.\n\n## Anti-Generic Rules (HARD)\n- NEVER use default blue (`#007bff`, `#2196F3`, `#3B82F6`) or default purple (`#6C63FF`, `#7C3AED`) unless the chosen palette in `references\u002Fpalettes.md` explicitly uses it.\n- NEVER ship plain white cards with `border-radius: 8px` and `box-shadow: 0 2px 4px rgba(0,0,0,0.1)`.\n- NEVER use system fonts or unnamed \"sans-serif\"; specify exact font families and fallbacks.\n- NEVER build a fully symmetrical layout without hierarchy through size, spacing, color, or motion.\n- ALWAYS choose a palette from `references\u002Fpalettes.md` before writing UI code.\n- ALWAYS choose a font pair from `references\u002Ftypography.md`.\n- ALWAYS apply at least one composition principle from `references\u002Fcomposition.md`.\n- ALWAYS add at least two micro-interactions from `references\u002Fmicro-interactions.md`.\n\n## Design Decision Flow\n1. Decide the mood: premium, bold, calm, editorial, playful, technical, or luxury.\n2. Pick one palette from `references\u002Fpalettes.md`.\n3. Pick one font pair from `references\u002Ftypography.md`.\n4. Pick one or two layout patterns from `references\u002Fpatterns.md`.\n5. Pick two or three micro-interactions from `references\u002Fmicro-interactions.md`.\n6. Check `references\u002Fanti-patterns.md` before finalizing.\n7. Then write UI code with explicit values for color, type, spacing, radius, and shadow.\n\n## Reference Files\n- `references\u002Fpalettes.md` — 30 curated palettes with exact hex tokens, mood, app fit, and contrast ratios.\n- `references\u002Ftypography.md` — 21 free font pairings with imports, weights, style tags, and fallback stacks.\n- `references\u002Fpatterns.md` — 20 layout patterns with structure, responsive CSS, and usage boundaries.\n- `references\u002Fmicro-interactions.md` — 15 motion patterns with CSS or JS code.\n- `references\u002Fcomposition.md` — Visual hierarchy, spacing, grids, storytelling flow, and emphasis rules.\n- `references\u002Ftrends.md` — Current design trends for 2025-2026 with code signatures and fit guidance.\n- `references\u002Fanti-patterns.md` — 15 developer-UI mistakes with wrong\u002Fright code and violated principles.\n","## TL;DR\nLoad before any UI\u002Ffrontend task. This skill brings 30 palettes, 21 free font pairings, 20 layout patterns, 15 micro-interactions, composition rules, current trends, and developer-UI anti-pattern fixes. Anti-generic rules: no default blue, no plain white card stacks, no bootstrap look.\n\n## Activation\n1. Activate when task involves UI, frontend, styling, component work, or landing-page creation.\n2. Activate on `$design` or \"make it look premium\u002Fmodern\u002Fcreative\".\n3. Auto-load when `frontend-specialist` agent is active.\n4. Pair with `codex-design-md` when the project needs a durable `DESIGN.md` contract or token export.\n\n## Anti-Generic Rules (HARD)\n- NEVER use default blue (`#007bff`, `#2196F3`, `#3B82F6`) or default purple (`#6C63FF`, `#7C3AED`) unless the chosen palette in `references\u002Fpalettes.md` explicitly uses it.\n- NEVER ship plain white cards with `border-radius: 8px` and `box-shadow: 0 2px 4px rgba(0,0,0,0.1)`.\n- NEVER use system fonts or unnamed \"sans-serif\"; specify exact font families and fallbacks.\n- NEVER build a fully symmetrical layout without hierarchy through size, spacing, color, or motion.\n- ALWAYS choose a palette from `references\u002Fpalettes.md` before writing UI code.\n- ALWAYS choose a font pair from `references\u002Ftypography.md`.\n- ALWAYS apply at least one composition principle from `references\u002Fcomposition.md`.\n- ALWAYS add at least two micro-interactions from `references\u002Fmicro-interactions.md`.\n\n## Design Decision Flow\n1. Decide the mood: premium, bold, calm, editorial, playful, technical, or luxury.\n2. Pick one palette from `references\u002Fpalettes.md`.\n3. Pick one font pair from `references\u002Ftypography.md`.\n4. Pick one or two layout patterns from `references\u002Fpatterns.md`.\n5. Pick two or three micro-interactions from `references\u002Fmicro-interactions.md`.\n6. Check `references\u002Fanti-patterns.md` before finalizing.\n7. Then write UI code with explicit values for color, type, spacing, radius, and shadow.\n\n## Reference Files\n- `references\u002Fpalettes.md` — 30 curated palettes with exact hex tokens, mood, app fit, and contrast ratios.\n- `references\u002Ftypography.md` — 21 free font pairings with imports, weights, style tags, and fallback stacks.\n- `references\u002Fpatterns.md` — 20 layout patterns with structure, responsive CSS, and usage boundaries.\n- `references\u002Fmicro-interactions.md` — 15 motion patterns with CSS or JS code.\n- `references\u002Fcomposition.md` — Visual hierarchy, spacing, grids, storytelling flow, and emphasis rules.\n- `references\u002Ftrends.md` — Current design trends for 2025-2026 with code signatures and fit guidance.\n- `references\u002Fanti-patterns.md` — 15 developer-UI mistakes with wrong\u002Fright code and violated principles.\n",{"name":5,"description":7,"load_priority":23},"on-demand","main","19b976c6b4f182f06d2d2e6b030549f2f8a69cc0","packages\u002Fcli\u002Fskills\u002Fcodex-design-system",0,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI","https:\u002F\u002Fgithub.com\u002FBang-isme","Hi my name is jeff","2026-07-15 19:58:17",{"source":8,"skillName":5,"commands":33,"prompt":43,"zipAvailable":44},[34,37,40],{"tool":35,"command":36},"npx","npx skills add Bang-isme\u002FAgencyCLI --skill codex-design-system",{"tool":38,"command":39},"bunx","bunx skills add Bang-isme\u002FAgencyCLI --skill codex-design-system",{"tool":41,"command":42},"pnpm","pnpm dlx skills add Bang-isme\u002FAgencyCLI --skill codex-design-system","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002FSKILL.md",true,[46,52,56,60,64,68,72],{"path":47,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":50,"sourceHtmlUrl":51},"references\u002Fanti-patterns.md","REFERENCE","参考文档",6790,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Fanti-patterns.md",{"path":53,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":54,"sourceHtmlUrl":55},"references\u002Fcomposition.md",5311,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Fcomposition.md",{"path":57,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":58,"sourceHtmlUrl":59},"references\u002Fmicro-interactions.md",8531,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Fmicro-interactions.md",{"path":61,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":62,"sourceHtmlUrl":63},"references\u002Fpalettes.md",6420,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Fpalettes.md",{"path":65,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":66,"sourceHtmlUrl":67},"references\u002Fpatterns.md",15160,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Fpatterns.md",{"path":69,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":70,"sourceHtmlUrl":71},"references\u002Ftrends.md",8766,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Ftrends.md",{"path":73,"resourceType":48,"resourceTypeDesc":49,"sizeBytes":74,"sourceHtmlUrl":75},"references\u002Ftypography.md",8233,"https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Fpackages\u002Fcli\u002Fskills\u002Fcodex-design-system\u002Freferences\u002Ftypography.md",[77,84,91,98,105,112],{"skillNo":78,"name":79,"nameZh":6,"description":80,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":81,"categories":82,"keywords":83,"publishedAt":18},"01M754T5CB6WCXB2AV8N0M50AC","codex-test-driven-development","Fixture stub for TDD skill.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-test-driven-development\u002FSKILL.md",[],[],{"skillNo":85,"name":86,"nameZh":6,"description":87,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":88,"categories":89,"keywords":90,"publishedAt":18},"01M754T41J59TG0MJYC52TES58","codex-subagent-execution","Fixture stub for subagent execution skill.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-subagent-execution\u002FSKILL.md",[],[],{"skillNo":92,"name":93,"nameZh":6,"description":94,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":95,"categories":96,"keywords":97,"publishedAt":18},"01M754T2JDSPA3YF83FK6BMNV6","codex-runtime-hook","Fixture stub for runtime hook skill.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-runtime-hook\u002FSKILL.md",[],[],{"skillNo":99,"name":100,"nameZh":6,"description":101,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":102,"categories":103,"keywords":104,"publishedAt":18},"01M754T1HG4JRTJVZC2PBFTXDT","codex-plan-writer","Fixture stub for plan writer skill.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-plan-writer\u002FSKILL.md",[],[],{"skillNo":106,"name":107,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":109,"categories":110,"keywords":111,"publishedAt":18},"01M754SZJVZKGQR5PSA6YFFY09","codex-execution-quality-gate","Fixture stub for quality gate skill.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-execution-quality-gate\u002FSKILL.md",[],[],{"skillNo":113,"name":114,"nameZh":6,"description":115,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":116,"categories":117,"keywords":118,"publishedAt":18},"01M754SXBJ1DE0JR6TK0XJ4SAK","codex-demo","Minimal fixture skill for Agency CLI skill-md parser tests.","https:\u002F\u002Fgithub.com\u002FBang-isme\u002FAgencyCLI\u002Fblob\u002Fmain\u002Ftests\u002Ffixtures\u002Fmock-skills\u002Fcodex-demo\u002FSKILL.md",[],[]]