[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M7ESX6S9T5JP80WWPBYBA65K":3,"skill-same:01M7ESX6S9T5JP80WWPBYBA65K":57},{"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":19,"linkOnly":20,"markdownContent":21,"markdownBody":22,"frontMatter":23,"refName":31,"commitSha":32,"skillDirectory":33,"forksCount":14,"repositoryHtmlUrl":34,"repositoryHomepageUrl":34,"ownerHtmlUrl":35,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":36,"install":37,"resources":50},"01M7ESX6S9T5JP80WWPBYBA65K","anthropic-ui-skills",null,"Anthropic's UI design system. Use when building interfaces inspired by Anthropic's aesthetic - light mode, Inter font, 4px grid.","Mr-Nobody-Anonymous\u002FAll-skills","Mr-Nobody-Anonymous","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F184253119?v=4","01M7AEXFJHKTYQW5R0ZCQQTWFV","anonymous","01M7C00M3GQR4QKP9GZA42GFAK",0,"MIT","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdesign\u002Fanthropic-ui-skills\u002FSKILL.md",[],[],"2026-11-15 14:19:17",false,"---\nname: anthropic-ui-skills\ndescription: Anthropic's UI design system. Use when building interfaces inspired by Anthropic's aesthetic - light mode, Inter font, 4px grid.\nmetadata:\n  author: design-skills\n  version: \"1.0.0\"\nsource: \"https:\u002F\u002Fgithub.com\u002Fihlamury\u002Fdesign-skills\"\nsource_repository: \"ihlamury\u002Fdesign-skills\"\nsource_path: \"skills\u002Fanthropic\u002FSKILL.md\"\nlicense: \"MIT\"\nimported_at: \"2026-09-20\"\n---\n\n# Anthropic UI Skills\n\nOpinionated constraints for building Anthropic-style interfaces with AI agents.\n\n## When to Apply\n\nReference these guidelines when:\n- Building light-mode interfaces\n- Creating Anthropic-inspired design systems\n- Implementing UIs with Inter font and 4px grid\n\n## Colors\n\n- SHOULD use light backgrounds for primary surfaces\n- MUST use `#ECE9E0` as page background (`surface-base`)\n- SHOULD limit color palette to 8 distinct colors\n- MUST maintain text contrast ratio of at least 4.5:1 for accessibility\n\n### Semantic Tokens\n\n| Token | HEX | RGB | Usage |\n|-------|-----|-----|-------|\n| `surface-base` | #ECE9E0 | rgb(236,233,224) | Page background |\n| `surface-raised` | #DBD1C0 | rgb(219,209,192) | Cards, modals, raised surfaces |\n| `surface-overlay` | #0F0F10 | rgb(15,15,16) | Overlays, tooltips, dropdowns |\n| `text-primary` | #625F59 | rgb(98,95,89) | Headings, body text |\n| `text-secondary` | #9F9F9C | rgb(159,159,156) | Secondary, muted text |\n| `text-tertiary` | #454036 | rgb(69,64,54) | Additional text |\n\n## Typography\n\n- MUST use `Inter` as primary font family\n- SHOULD use single font family for consistency\n- MUST use `68px` \u002F `700` for primary headings\n- MUST use `33px` \u002F `semi_bold` for body text\n- SHOULD reduce font weights (currently 5 detected)\n- MUST use `text-balance` for headings and `text-pretty` for body text\n- SHOULD use `tabular-nums` for numeric data\n- NEVER modify letter-spacing unless explicitly requested\n\n### Text Styles\n\n| Style | Font | Size | Weight | Color | Count |\n|-------|------|------|--------|-------|-------|\n| `heading-1` | Inter | 68px | 700 | #201F1D | 1 |\n| `body` | Inter | 33px | semi_bold | #35312A | 1 |\n| `text-23px` | Inter | 23px | 500 | #403D37 | 1 |\n| `text-21px` | Inter | 21px | 400 | #3D362C | 1 |\n| `text-21px` | Inter | 21px | 400 | #3B352B | 1 |\n| `text-20px` | Inter | 20px | 400 | #494237 | 1 |\n| `text-17px` | Inter | 17px | 500 | #423F3B | 1 |\n| `text-16px` | Inter | 16px | 400 | #454036 | 1 |\n| `text-14px` | Inter | 14px | 500 | #3F3931 | 1 |\n| `text-14px` | Inter | 14px | 400 | #A2A3A0 | 1 |\n\n### Typography Reference\n\n**Font Families:**\n- `Inter` (used 16x)\n\n**Font Sizes:** 10px, 11px, 14px, 16px, 17px, 20px, 21px, 23px, 33px, 68px\n\n## Spacing\n\n- MUST use 4px grid for spacing\n- SHOULD use spacing from scale: 3px, 4px, 5px, 6px\n- SHOULD use 5px as default gap between elements\n- NEVER use arbitrary spacing values (use design scale)\n- SHOULD maintain consistent padding within containers\n\n## Borders\n\n- MUST use border-radius from scale: 3px, 15px\n- SHOULD use 3px as default border-radius\n- NEVER use arbitrary border-radius values (use design scale)\n- SHOULD use subtle borders (1px) for element separation\n\n### Border Radius Reference\n\n**Scale:** 3px, 15px\n\n## Layout\n\n- MUST design for 1920px base viewport width\n- SHOULD use consistent element widths: 10px, 18px, 146px, 579px\n- SHOULD maintain text-heavy layout with clear hierarchy\n- NEVER use `h-screen`, use `h-dvh` for full viewport height\n- MUST respect `safe-area-inset` for fixed elements\n- SHOULD use `size-*` for square elements instead of `w-*` + `h-*`\n\n### Detected Layout Patterns\n\n- **Main Content**: width: 1920px, height: 1004px\n- **Main Content**: width: 1920px, height: 673px\n\n## Components\n\n- MUST use `0px` height for input fields\n\n### Buttons\n\n| Variant | Background | Text | Border | Height | Radius |\n|---------|------------|------|--------|--------|--------|\n| Ghost | transparent | #9F9F9C | none | - | - |\n\n### Inputs\n\n- Height: `0px`\n\n## Interactive States\n\n### Focus\n\n- MUST use `2px` outline with accent color (`#5E6AD2`)\n- MUST use `2px` outline-offset\n- NEVER remove focus indicators\n\n### Hover\n\n- Buttons (primary): lighten background by 10%\n- Buttons (secondary): use `#DBD1C0` background\n- List items: use `#DBD1C0` background\n\n### Disabled\n\n- MUST use `opacity: 0.5`\n- MUST use `cursor: not-allowed`\n\n## Interaction\n\n- MUST use an `AlertDialog` for destructive or irreversible actions\n- SHOULD use structural skeletons for loading states\n- MUST show errors next to where the action happens\n- NEVER block paste in `input` or `textarea` elements\n- MUST add an `aria-label` to icon-only buttons\n\n## Animation\n\n- NEVER add animation unless it is explicitly requested\n- MUST animate only compositor props (`transform`, `opacity`)\n- NEVER animate layout properties (`width`, `height`, `top`, `left`, `margin`, `padding`)\n- SHOULD use `ease-out` on entrance animations\n- NEVER exceed `200ms` for interaction feedback\n- SHOULD respect `prefers-reduced-motion`\n\n## Performance\n\n- NEVER animate large `blur()` or `backdrop-filter` surfaces\n- NEVER apply `will-change` outside an active animation\n- NEVER use `useEffect` for anything that can be expressed as render logic\n","# Anthropic UI Skills\n\nOpinionated constraints for building Anthropic-style interfaces with AI agents.\n\n## When to Apply\n\nReference these guidelines when:\n- Building light-mode interfaces\n- Creating Anthropic-inspired design systems\n- Implementing UIs with Inter font and 4px grid\n\n## Colors\n\n- SHOULD use light backgrounds for primary surfaces\n- MUST use `#ECE9E0` as page background (`surface-base`)\n- SHOULD limit color palette to 8 distinct colors\n- MUST maintain text contrast ratio of at least 4.5:1 for accessibility\n\n### Semantic Tokens\n\n| Token | HEX | RGB | Usage |\n|-------|-----|-----|-------|\n| `surface-base` | #ECE9E0 | rgb(236,233,224) | Page background |\n| `surface-raised` | #DBD1C0 | rgb(219,209,192) | Cards, modals, raised surfaces |\n| `surface-overlay` | #0F0F10 | rgb(15,15,16) | Overlays, tooltips, dropdowns |\n| `text-primary` | #625F59 | rgb(98,95,89) | Headings, body text |\n| `text-secondary` | #9F9F9C | rgb(159,159,156) | Secondary, muted text |\n| `text-tertiary` | #454036 | rgb(69,64,54) | Additional text |\n\n## Typography\n\n- MUST use `Inter` as primary font family\n- SHOULD use single font family for consistency\n- MUST use `68px` \u002F `700` for primary headings\n- MUST use `33px` \u002F `semi_bold` for body text\n- SHOULD reduce font weights (currently 5 detected)\n- MUST use `text-balance` for headings and `text-pretty` for body text\n- SHOULD use `tabular-nums` for numeric data\n- NEVER modify letter-spacing unless explicitly requested\n\n### Text Styles\n\n| Style | Font | Size | Weight | Color | Count |\n|-------|------|------|--------|-------|-------|\n| `heading-1` | Inter | 68px | 700 | #201F1D | 1 |\n| `body` | Inter | 33px | semi_bold | #35312A | 1 |\n| `text-23px` | Inter | 23px | 500 | #403D37 | 1 |\n| `text-21px` | Inter | 21px | 400 | #3D362C | 1 |\n| `text-21px` | Inter | 21px | 400 | #3B352B | 1 |\n| `text-20px` | Inter | 20px | 400 | #494237 | 1 |\n| `text-17px` | Inter | 17px | 500 | #423F3B | 1 |\n| `text-16px` | Inter | 16px | 400 | #454036 | 1 |\n| `text-14px` | Inter | 14px | 500 | #3F3931 | 1 |\n| `text-14px` | Inter | 14px | 400 | #A2A3A0 | 1 |\n\n### Typography Reference\n\n**Font Families:**\n- `Inter` (used 16x)\n\n**Font Sizes:** 10px, 11px, 14px, 16px, 17px, 20px, 21px, 23px, 33px, 68px\n\n## Spacing\n\n- MUST use 4px grid for spacing\n- SHOULD use spacing from scale: 3px, 4px, 5px, 6px\n- SHOULD use 5px as default gap between elements\n- NEVER use arbitrary spacing values (use design scale)\n- SHOULD maintain consistent padding within containers\n\n## Borders\n\n- MUST use border-radius from scale: 3px, 15px\n- SHOULD use 3px as default border-radius\n- NEVER use arbitrary border-radius values (use design scale)\n- SHOULD use subtle borders (1px) for element separation\n\n### Border Radius Reference\n\n**Scale:** 3px, 15px\n\n## Layout\n\n- MUST design for 1920px base viewport width\n- SHOULD use consistent element widths: 10px, 18px, 146px, 579px\n- SHOULD maintain text-heavy layout with clear hierarchy\n- NEVER use `h-screen`, use `h-dvh` for full viewport height\n- MUST respect `safe-area-inset` for fixed elements\n- SHOULD use `size-*` for square elements instead of `w-*` + `h-*`\n\n### Detected Layout Patterns\n\n- **Main Content**: width: 1920px, height: 1004px\n- **Main Content**: width: 1920px, height: 673px\n\n## Components\n\n- MUST use `0px` height for input fields\n\n### Buttons\n\n| Variant | Background | Text | Border | Height | Radius |\n|---------|------------|------|--------|--------|--------|\n| Ghost | transparent | #9F9F9C | none | - | - |\n\n### Inputs\n\n- Height: `0px`\n\n## Interactive States\n\n### Focus\n\n- MUST use `2px` outline with accent color (`#5E6AD2`)\n- MUST use `2px` outline-offset\n- NEVER remove focus indicators\n\n### Hover\n\n- Buttons (primary): lighten background by 10%\n- Buttons (secondary): use `#DBD1C0` background\n- List items: use `#DBD1C0` background\n\n### Disabled\n\n- MUST use `opacity: 0.5`\n- MUST use `cursor: not-allowed`\n\n## Interaction\n\n- MUST use an `AlertDialog` for destructive or irreversible actions\n- SHOULD use structural skeletons for loading states\n- MUST show errors next to where the action happens\n- NEVER block paste in `input` or `textarea` elements\n- MUST add an `aria-label` to icon-only buttons\n\n## Animation\n\n- NEVER add animation unless it is explicitly requested\n- MUST animate only compositor props (`transform`, `opacity`)\n- NEVER animate layout properties (`width`, `height`, `top`, `left`, `margin`, `padding`)\n- SHOULD use `ease-out` on entrance animations\n- NEVER exceed `200ms` for interaction feedback\n- SHOULD respect `prefers-reduced-motion`\n\n## Performance\n\n- NEVER animate large `blur()` or `backdrop-filter` surfaces\n- NEVER apply `will-change` outside an active animation\n- NEVER use `useEffect` for anything that can be expressed as render logic\n",{"name":5,"source":24,"license":15,"metadata":25,"description":7,"imported_at":28,"source_path":29,"source_repository":30},"https:\u002F\u002Fgithub.com\u002Fihlamury\u002Fdesign-skills",{"author":26,"version":27},"design-skills","1.0.0","2026-09-20","skills\u002Fanthropic\u002FSKILL.md","ihlamury\u002Fdesign-skills","main","2d1750717747097b602acf30bd09a7cbd4b4c6ea","awesome_skills\u002Fdesign\u002Fanthropic-ui-skills","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous","2026-11-09 11:45:36",{"source":8,"skillName":5,"commands":38,"prompt":48,"zipAvailable":49},[39,42,45],{"tool":40,"command":41},"npx","npx skills add Mr-Nobody-Anonymous\u002FAll-skills --skill anthropic-ui-skills",{"tool":43,"command":44},"bunx","bunx skills add Mr-Nobody-Anonymous\u002FAll-skills --skill anthropic-ui-skills",{"tool":46,"command":47},"pnpm","pnpm dlx skills add Mr-Nobody-Anonymous\u002FAll-skills --skill anthropic-ui-skills","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdesign\u002Fanthropic-ui-skills\u002FSKILL.md",true,[51],{"path":52,"resourceType":53,"resourceTypeDesc":54,"sizeBytes":55,"sourceHtmlUrl":56},"metadata.json","REFERENCE","参考文档",275,"https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdesign\u002Fanthropic-ui-skills\u002Fmetadata.json",[58,66,73,80,87,94],{"skillNo":59,"name":60,"nameZh":6,"description":61,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":62,"categories":63,"keywords":64,"publishedAt":65},"01M7EXRQF9GFM7D9BG6N5HAT34","oath","Auditing regulatory compliance (SOC2\u002FPCI-DSS\u002FHIPAA\u002FISO 27001): maps requirements, checks controls, designs audit trails, implements Policy as Code. Use when compliance auditing is needed.","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Foath\u002FSKILL.md",[],[],"2026-11-15 14:25:24",{"skillNo":67,"name":68,"nameZh":6,"description":69,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":70,"categories":71,"keywords":72,"publishedAt":19},"01M7EXRH7TYTNZJT0BQXEWAMW7","nexus","Orchestrating multi-specialist task chains and scope-adaptive product delivery: classifies intent, selects and executes the minimum viable chain, aggregates results, and verifies acceptance criteria. For multi-domain tasks, build-first delivery, and product lifecycle execution.","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Fnexus\u002FSKILL.md",[],[],{"skillNo":74,"name":75,"nameZh":6,"description":76,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":77,"categories":78,"keywords":79,"publishedAt":19},"01M7EXRCDPFWVEEEFR2ZQGJCYY","nest","Designing LLM-optimized folder structures: audits and restructures directories for context efficiency, progressive disclosure, and prompt cache performance. Not for general repo structure (Grove).","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Fnest\u002FSKILL.md",[],[],{"skillNo":81,"name":82,"nameZh":6,"description":83,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":84,"categories":85,"keywords":86,"publishedAt":19},"01M7EXR7JEER60TH0HD0AH4EE9","native","Implementing production iOS\u002FAndroid\u002FmacOS native features (SwiftUI, Compose) and iterating a screen against a reference design. Not for cross-platform RN\u002FFlutter (Port) or web (Artisan).","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Fnative\u002FSKILL.md",[],[],{"skillNo":88,"name":89,"nameZh":6,"description":90,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":91,"categories":92,"keywords":93,"publishedAt":19},"01M7EXR133J7DD5961R80QTRZY","muse","Defining and managing design tokens, applying token systems to existing codebases, building design system foundations. Use for spacing, color, typography, dark mode, cross-platform output.","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Fmuse\u002FSKILL.md",[],[],{"skillNo":95,"name":96,"nameZh":6,"description":97,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":98,"categories":99,"keywords":100,"publishedAt":19},"01M7EXQWWX7ECQN0J50B41YN5N","morph","Converting document formats (Markdown\u002FWord\u002FExcel\u002FPDF\u002FHTML) and generating reusable conversion scripts. Use for distributable specs, accessibility-compliant PDFs, or Pandoc\u002FLibreOffice pipelines.","https:\u002F\u002Fgithub.com\u002FMr-Nobody-Anonymous\u002FAll-skills\u002Fblob\u002Fmain\u002Fawesome_skills\u002Fdevsecops\u002Fmorph\u002FSKILL.md",[],[]]