[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M70GDZ79MJ3VGAJ7PQR8B560":3,"skill-same:01M70GDZ79MJ3VGAJ7PQR8B560":74},{"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":28,"publishedAt":47,"linkOnly":48,"markdownContent":49,"markdownBody":50,"frontMatter":51,"refName":52,"commitSha":53,"skillDirectory":54,"forksCount":55,"repositoryHtmlUrl":56,"repositoryHomepageUrl":6,"ownerHtmlUrl":57,"ownerBlogUrl":6,"ownerDescription":58,"updatedAt":59,"install":60,"resources":73},"01M70GDZ79MJ3VGAJ7PQR8B560","liquid-glass-design",null,"iOS 26 Liquid Glass design system — dynamic glass material with blur, reflection, and interactive morphing for SwiftUI, UIKit, and WidgetKit. Use when building iOS 26 Liquid Glass UI in SwiftUI, UIKit, or WidgetKit.","mdnaimul22\u002Fhuman-skills","mdnaimul22","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F64520358?v=4","01M70FH95MH2H796Q01TYSFZ03","Naimul","01M70FH96798CQR4YHA13F17GA",3,"MIT","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Faffaan-m_ECC\u002Fliquid-glass-design\u002FSKILL.md",[18,23],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000015","视觉设计","SCENARIO","使用场景",{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46],"liquid glass design","liquid glass","liquid","design","ios","with","interactive","uikit","swiftui","use","material","reflection","system","for","ui","design system","when","blur","2026-11-10 10:12:30",false,"---\nname: liquid-glass-design\ndescription: iOS 26 Liquid Glass design system — dynamic glass material with blur, reflection, and interactive morphing for SwiftUI, UIKit, and WidgetKit. Use when building iOS 26 Liquid Glass UI in SwiftUI, UIKit, or WidgetKit.\n---\n\n# Liquid Glass Design System (iOS 26)\n\nPatterns for implementing Apple's Liquid Glass — a dynamic material that blurs content behind it, reflects color and light from surrounding content, and reacts to touch and pointer interactions. Covers SwiftUI, UIKit, and WidgetKit integration.\n\n## When to Activate\n\n- Building or updating apps for iOS 26+ with the new design language\n- Implementing glass-style buttons, cards, toolbars, or containers\n- Creating morphing transitions between glass elements\n- Applying Liquid Glass effects to widgets\n- Migrating existing blur\u002Fmaterial effects to the new Liquid Glass API\n\n## Core Pattern — SwiftUI\n\n### Basic Glass Effect\n\nThe simplest way to add Liquid Glass to any view:\n\n```swift\nText(\"Hello, World!\")\n    .font(.title)\n    .padding()\n    .glassEffect()  \u002F\u002F Default: regular variant, capsule shape\n```\n\n### Customizing Shape and Tint\n\n```swift\nText(\"Hello, World!\")\n    .font(.title)\n    .padding()\n    .glassEffect(.regular.tint(.orange).interactive(), in: .rect(cornerRadius: 16.0))\n```\n\nKey customization options:\n- `.regular` — standard glass effect\n- `.tint(Color)` — add color tint for prominence\n- `.interactive()` — react to touch and pointer interactions\n- Shape: `.capsule` (default), `.rect(cornerRadius:)`, `.circle`\n\n### Glass Button Styles\n\n```swift\nButton(\"Click Me\") { \u002F* action *\u002F }\n    .buttonStyle(.glass)\n\nButton(\"Important\") { \u002F* action *\u002F }\n    .buttonStyle(.glassProminent)\n```\n\n### GlassEffectContainer for Multiple Elements\n\nAlways wrap multiple glass views in a container for performance and morphing:\n\n```swift\nGlassEffectContainer(spacing: 40.0) {\n    HStack(spacing: 40.0) {\n        Image(systemName: \"scribble.variable\")\n            .frame(width: 80.0, height: 80.0)\n            .font(.system(size: 36))\n            .glassEffect()\n\n        Image(systemName: \"eraser.fill\")\n            .frame(width: 80.0, height: 80.0)\n            .font(.system(size: 36))\n            .glassEffect()\n    }\n}\n```\n\nThe `spacing` parameter controls merge distance — closer elements blend their glass shapes together.\n\n### Uniting Glass Effects\n\nCombine multiple views into a single glass shape with `glassEffectUnion`:\n\n```swift\n@Namespace private var namespace\n\nGlassEffectContainer(spacing: 20.0) {\n    HStack(spacing: 20.0) {\n        ForEach(symbolSet.indices, id: \\.self) { item in\n            Image(systemName: symbolSet[item])\n                .frame(width: 80.0, height: 80.0)\n                .glassEffect()\n                .glassEffectUnion(id: item \u003C 2 ? \"group1\" : \"group2\", namespace: namespace)\n        }\n    }\n}\n```\n\n### Morphing Transitions\n\nCreate smooth morphing when glass elements appear\u002Fdisappear:\n\n```swift\n@State private var isExpanded = false\n@Namespace private var namespace\n\nGlassEffectContainer(spacing: 40.0) {\n    HStack(spacing: 40.0) {\n        Image(systemName: \"scribble.variable\")\n            .frame(width: 80.0, height: 80.0)\n            .glassEffect()\n            .glassEffectID(\"pencil\", in: namespace)\n\n        if isExpanded {\n            Image(systemName: \"eraser.fill\")\n                .frame(width: 80.0, height: 80.0)\n                .glassEffect()\n                .glassEffectID(\"eraser\", in: namespace)\n        }\n    }\n}\n\nButton(\"Toggle\") {\n    withAnimation { isExpanded.toggle() }\n}\n.buttonStyle(.glass)\n```\n\n### Extending Horizontal Scrolling Under Sidebar\n\nTo allow horizontal scroll content to extend under a sidebar or inspector, ensure the `ScrollView` content reaches the leading\u002Ftrailing edges of the container. The system automatically handles the under-sidebar scrolling behavior when the layout extends to the edges — no additional modifier is needed.\n\n## Core Pattern — UIKit\n\n### Basic UIGlassEffect\n\n```swift\nlet glassEffect = UIGlassEffect()\nglassEffect.tintColor = UIColor.systemBlue.withAlphaComponent(0.3)\nglassEffect.isInteractive = true\n\nlet visualEffectView = UIVisualEffectView(effect: glassEffect)\nvisualEffectView.translatesAutoresizingMaskIntoConstraints = false\nvisualEffectView.layer.cornerRadius = 20\nvisualEffectView.clipsToBounds = true\n\nview.addSubview(visualEffectView)\nNSLayoutConstraint.activate([\n    visualEffectView.centerXAnchor.constraint(equalTo: view.centerXAnchor),\n    visualEffectView.centerYAnchor.constraint(equalTo: view.centerYAnchor),\n    visualEffectView.widthAnchor.constraint(equalToConstant: 200),\n    visualEffectView.heightAnchor.constraint(equalToConstant: 120)\n])\n\n\u002F\u002F Add content to contentView\nlet label = UILabel()\nlabel.text = \"Liquid Glass\"\nlabel.translatesAutoresizingMaskIntoConstraints = false\nvisualEffectView.contentView.addSubview(label)\nNSLayoutConstraint.activate([\n    label.centerXAnchor.constraint(equalTo: visualEffectView.contentView.centerXAnchor),\n    label.centerYAnchor.constraint(equalTo: visualEffectView.contentView.centerYAnchor)\n])\n```\n\n### UIGlassContainerEffect for Multiple Elements\n\n```swift\nlet containerEffect = UIGlassContainerEffect()\ncontainerEffect.spacing = 40.0\n\nlet containerView = UIVisualEffectView(effect: containerEffect)\n\nlet firstGlass = UIVisualEffectView(effect: UIGlassEffect())\nlet secondGlass = UIVisualEffectView(effect: UIGlassEffect())\n\ncontainerView.contentView.addSubview(firstGlass)\ncontainerView.contentView.addSubview(secondGlass)\n```\n\n### Scroll Edge Effects\n\n```swift\nscrollView.topEdgeEffect.style = .automatic\nscrollView.bottomEdgeEffect.style = .hard\nscrollView.leftEdgeEffect.isHidden = true\n```\n\n### Toolbar Glass Integration\n\n```swift\nlet favoriteButton = UIBarButtonItem(image: UIImage(systemName: \"heart\"), style: .plain, target: self, action: #selector(favoriteAction))\nfavoriteButton.hidesSharedBackground = true  \u002F\u002F Opt out of shared glass background\n```\n\n## Core Pattern — WidgetKit\n\n### Rendering Mode Detection\n\n```swift\nstruct MyWidgetView: View {\n    @Environment(\\.widgetRenderingMode) var renderingMode\n\n    var body: some View {\n        if renderingMode == .accented {\n            \u002F\u002F Tinted mode: white-tinted, themed glass background\n        } else {\n            \u002F\u002F Full color mode: standard appearance\n        }\n    }\n}\n```\n\n### Accent Groups for Visual Hierarchy\n\n```swift\nHStack {\n    VStack(alignment: .leading) {\n        Text(\"Title\")\n            .widgetAccentable()  \u002F\u002F Accent group\n        Text(\"Subtitle\")\n            \u002F\u002F Primary group (default)\n    }\n    Image(systemName: \"star.fill\")\n        .widgetAccentable()  \u002F\u002F Accent group\n}\n```\n\n### Image Rendering in Accented Mode\n\n```swift\nImage(\"myImage\")\n    .widgetAccentedRenderingMode(.monochrome)\n```\n\n### Container Background\n\n```swift\nVStack { \u002F* content *\u002F }\n    .containerBackground(for: .widget) {\n        Color.blue.opacity(0.2)\n    }\n```\n\n## Key Design Decisions\n\n| Decision | Rationale |\n|----------|-----------|\n| GlassEffectContainer wrapping | Performance optimization, enables morphing between glass elements |\n| `spacing` parameter | Controls merge distance — fine-tune how close elements must be to blend |\n| `@Namespace` + `glassEffectID` | Enables smooth morphing transitions on view hierarchy changes |\n| `interactive()` modifier | Explicit opt-in for touch\u002Fpointer reactions — not all glass should respond |\n| UIGlassContainerEffect in UIKit | Same container pattern as SwiftUI for consistency |\n| Accented rendering mode in widgets | System applies tinted glass when user selects tinted Home Screen |\n\n## Best Practices\n\n- **Always use GlassEffectContainer** when applying glass to multiple sibling views — it enables morphing and improves rendering performance\n- **Apply `.glassEffect()` after** other appearance modifiers (frame, font, padding)\n- **Use `.interactive()`** only on elements that respond to user interaction (buttons, toggleable items)\n- **Choose spacing carefully** in containers to control when glass effects merge\n- **Use `withAnimation`** when changing view hierarchies to enable smooth morphing transitions\n- **Test across appearances** — light mode, dark mode, and accented\u002Ftinted modes\n- **Ensure accessibility contrast** — text on glass must remain readable\n\n## Anti-Patterns to Avoid\n\n- Using multiple standalone `.glassEffect()` views without a GlassEffectContainer\n- Nesting too many glass effects — degrades performance and visual clarity\n- Applying glass to every view — reserve for interactive elements, toolbars, and cards\n- Forgetting `clipsToBounds = true` in UIKit when using corner radii\n- Ignoring accented rendering mode in widgets — breaks tinted Home Screen appearance\n- Using opaque backgrounds behind glass — defeats the translucency effect\n\n## When to Use\n\n- Navigation bars, toolbars, and tab bars with the new iOS 26 design\n- Floating action buttons and card-style containers\n- Interactive controls that need visual depth and touch feedback\n- Widgets that should integrate with the system's Liquid Glass appearance\n- Morphing transitions between related UI states\n","# Liquid Glass Design System (iOS 26)\n\nPatterns for implementing Apple's Liquid Glass — a dynamic material that blurs content behind it, reflects color and light from surrounding content, and reacts to touch and pointer interactions. Covers SwiftUI, UIKit, and WidgetKit integration.\n\n## When to Activate\n\n- Building or updating apps for iOS 26+ with the new design language\n- Implementing glass-style buttons, cards, toolbars, or containers\n- Creating morphing transitions between glass elements\n- Applying Liquid Glass effects to widgets\n- Migrating existing blur\u002Fmaterial effects to the new Liquid Glass API\n\n## Core Pattern — SwiftUI\n\n### Basic Glass Effect\n\nThe simplest way to add Liquid Glass to any view:\n\n```swift\nText(\"Hello, World!\")\n    .font(.title)\n    .padding()\n    .glassEffect()  \u002F\u002F Default: regular variant, capsule shape\n```\n\n### Customizing Shape and Tint\n\n```swift\nText(\"Hello, World!\")\n    .font(.title)\n    .padding()\n    .glassEffect(.regular.tint(.orange).interactive(), in: .rect(cornerRadius: 16.0))\n```\n\nKey customization options:\n- `.regular` — standard glass effect\n- `.tint(Color)` — add color tint for prominence\n- `.interactive()` — react to touch and pointer interactions\n- Shape: `.capsule` (default), `.rect(cornerRadius:)`, `.circle`\n\n### Glass Button Styles\n\n```swift\nButton(\"Click Me\") { \u002F* action *\u002F }\n    .buttonStyle(.glass)\n\nButton(\"Important\") { \u002F* action *\u002F }\n    .buttonStyle(.glassProminent)\n```\n\n### GlassEffectContainer for Multiple Elements\n\nAlways wrap multiple glass views in a container for performance and morphing:\n\n```swift\nGlassEffectContainer(spacing: 40.0) {\n    HStack(spacing: 40.0) {\n        Image(systemName: \"scribble.variable\")\n            .frame(width: 80.0, height: 80.0)\n            .font(.system(size: 36))\n            .glassEffect()\n\n        Image(systemName: \"eraser.fill\")\n            .frame(width: 80.0, height: 80.0)\n            .font(.system(size: 36))\n            .glassEffect()\n    }\n}\n```\n\nThe `spacing` parameter controls merge distance — closer elements blend their glass shapes together.\n\n### Uniting Glass Effects\n\nCombine multiple views into a single glass shape with `glassEffectUnion`:\n\n```swift\n@Namespace private var namespace\n\nGlassEffectContainer(spacing: 20.0) {\n    HStack(spacing: 20.0) {\n        ForEach(symbolSet.indices, id: \\.self) { item in\n            Image(systemName: symbolSet[item])\n                .frame(width: 80.0, height: 80.0)\n                .glassEffect()\n                .glassEffectUnion(id: item \u003C 2 ? \"group1\" : \"group2\", namespace: namespace)\n        }\n    }\n}\n```\n\n### Morphing Transitions\n\nCreate smooth morphing when glass elements appear\u002Fdisappear:\n\n```swift\n@State private var isExpanded = false\n@Namespace private var namespace\n\nGlassEffectContainer(spacing: 40.0) {\n    HStack(spacing: 40.0) {\n        Image(systemName: \"scribble.variable\")\n            .frame(width: 80.0, height: 80.0)\n            .glassEffect()\n            .glassEffectID(\"pencil\", in: namespace)\n\n        if isExpanded {\n            Image(systemName: \"eraser.fill\")\n                .frame(width: 80.0, height: 80.0)\n                .glassEffect()\n                .glassEffectID(\"eraser\", in: namespace)\n        }\n    }\n}\n\nButton(\"Toggle\") {\n    withAnimation { isExpanded.toggle() }\n}\n.buttonStyle(.glass)\n```\n\n### Extending Horizontal Scrolling Under Sidebar\n\nTo allow horizontal scroll content to extend under a sidebar or inspector, ensure the `ScrollView` content reaches the leading\u002Ftrailing edges of the container. The system automatically handles the under-sidebar scrolling behavior when the layout extends to the edges — no additional modifier is needed.\n\n## Core Pattern — UIKit\n\n### Basic UIGlassEffect\n\n```swift\nlet glassEffect = UIGlassEffect()\nglassEffect.tintColor = UIColor.systemBlue.withAlphaComponent(0.3)\nglassEffect.isInteractive = true\n\nlet visualEffectView = UIVisualEffectView(effect: glassEffect)\nvisualEffectView.translatesAutoresizingMaskIntoConstraints = false\nvisualEffectView.layer.cornerRadius = 20\nvisualEffectView.clipsToBounds = true\n\nview.addSubview(visualEffectView)\nNSLayoutConstraint.activate([\n    visualEffectView.centerXAnchor.constraint(equalTo: view.centerXAnchor),\n    visualEffectView.centerYAnchor.constraint(equalTo: view.centerYAnchor),\n    visualEffectView.widthAnchor.constraint(equalToConstant: 200),\n    visualEffectView.heightAnchor.constraint(equalToConstant: 120)\n])\n\n\u002F\u002F Add content to contentView\nlet label = UILabel()\nlabel.text = \"Liquid Glass\"\nlabel.translatesAutoresizingMaskIntoConstraints = false\nvisualEffectView.contentView.addSubview(label)\nNSLayoutConstraint.activate([\n    label.centerXAnchor.constraint(equalTo: visualEffectView.contentView.centerXAnchor),\n    label.centerYAnchor.constraint(equalTo: visualEffectView.contentView.centerYAnchor)\n])\n```\n\n### UIGlassContainerEffect for Multiple Elements\n\n```swift\nlet containerEffect = UIGlassContainerEffect()\ncontainerEffect.spacing = 40.0\n\nlet containerView = UIVisualEffectView(effect: containerEffect)\n\nlet firstGlass = UIVisualEffectView(effect: UIGlassEffect())\nlet secondGlass = UIVisualEffectView(effect: UIGlassEffect())\n\ncontainerView.contentView.addSubview(firstGlass)\ncontainerView.contentView.addSubview(secondGlass)\n```\n\n### Scroll Edge Effects\n\n```swift\nscrollView.topEdgeEffect.style = .automatic\nscrollView.bottomEdgeEffect.style = .hard\nscrollView.leftEdgeEffect.isHidden = true\n```\n\n### Toolbar Glass Integration\n\n```swift\nlet favoriteButton = UIBarButtonItem(image: UIImage(systemName: \"heart\"), style: .plain, target: self, action: #selector(favoriteAction))\nfavoriteButton.hidesSharedBackground = true  \u002F\u002F Opt out of shared glass background\n```\n\n## Core Pattern — WidgetKit\n\n### Rendering Mode Detection\n\n```swift\nstruct MyWidgetView: View {\n    @Environment(\\.widgetRenderingMode) var renderingMode\n\n    var body: some View {\n        if renderingMode == .accented {\n            \u002F\u002F Tinted mode: white-tinted, themed glass background\n        } else {\n            \u002F\u002F Full color mode: standard appearance\n        }\n    }\n}\n```\n\n### Accent Groups for Visual Hierarchy\n\n```swift\nHStack {\n    VStack(alignment: .leading) {\n        Text(\"Title\")\n            .widgetAccentable()  \u002F\u002F Accent group\n        Text(\"Subtitle\")\n            \u002F\u002F Primary group (default)\n    }\n    Image(systemName: \"star.fill\")\n        .widgetAccentable()  \u002F\u002F Accent group\n}\n```\n\n### Image Rendering in Accented Mode\n\n```swift\nImage(\"myImage\")\n    .widgetAccentedRenderingMode(.monochrome)\n```\n\n### Container Background\n\n```swift\nVStack { \u002F* content *\u002F }\n    .containerBackground(for: .widget) {\n        Color.blue.opacity(0.2)\n    }\n```\n\n## Key Design Decisions\n\n| Decision | Rationale |\n|----------|-----------|\n| GlassEffectContainer wrapping | Performance optimization, enables morphing between glass elements |\n| `spacing` parameter | Controls merge distance — fine-tune how close elements must be to blend |\n| `@Namespace` + `glassEffectID` | Enables smooth morphing transitions on view hierarchy changes |\n| `interactive()` modifier | Explicit opt-in for touch\u002Fpointer reactions — not all glass should respond |\n| UIGlassContainerEffect in UIKit | Same container pattern as SwiftUI for consistency |\n| Accented rendering mode in widgets | System applies tinted glass when user selects tinted Home Screen |\n\n## Best Practices\n\n- **Always use GlassEffectContainer** when applying glass to multiple sibling views — it enables morphing and improves rendering performance\n- **Apply `.glassEffect()` after** other appearance modifiers (frame, font, padding)\n- **Use `.interactive()`** only on elements that respond to user interaction (buttons, toggleable items)\n- **Choose spacing carefully** in containers to control when glass effects merge\n- **Use `withAnimation`** when changing view hierarchies to enable smooth morphing transitions\n- **Test across appearances** — light mode, dark mode, and accented\u002Ftinted modes\n- **Ensure accessibility contrast** — text on glass must remain readable\n\n## Anti-Patterns to Avoid\n\n- Using multiple standalone `.glassEffect()` views without a GlassEffectContainer\n- Nesting too many glass effects — degrades performance and visual clarity\n- Applying glass to every view — reserve for interactive elements, toolbars, and cards\n- Forgetting `clipsToBounds = true` in UIKit when using corner radii\n- Ignoring accented rendering mode in widgets — breaks tinted Home Screen appearance\n- Using opaque backgrounds behind glass — defeats the translucency effect\n\n## When to Use\n\n- Navigation bars, toolbars, and tab bars with the new iOS 26 design\n- Floating action buttons and card-style containers\n- Interactive controls that need visual depth and touch feedback\n- Widgets that should integrate with the system's Liquid Glass appearance\n- Morphing transitions between related UI states\n",{"name":5,"description":7},"main","74715deacdc69119d739f38916f8ee4f0f979ebf","skills\u002Fstorage\u002Faffaan-m_ECC\u002Fliquid-glass-design",0,"https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills","https:\u002F\u002Fgithub.com\u002Fmdnaimul22","AI Agents Workflows Automation | Specializing in Python, FastAPI, MCP Agents & Custom ERP.","2026-11-11 21:16:57",{"source":8,"skillName":5,"commands":61,"prompt":71,"zipAvailable":72},[62,65,68],{"tool":63,"command":64},"npx","npx skills add mdnaimul22\u002Fhuman-skills --skill liquid-glass-design",{"tool":66,"command":67},"bunx","bunx skills add mdnaimul22\u002Fhuman-skills --skill liquid-glass-design",{"tool":69,"command":70},"pnpm","pnpm dlx skills add mdnaimul22\u002Fhuman-skills --skill liquid-glass-design","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Faffaan-m_ECC\u002Fliquid-glass-design\u002FSKILL.md",true,[],[75,83,109,130,149,164],{"skillNo":76,"name":77,"nameZh":6,"description":78,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":79,"categories":80,"keywords":81,"publishedAt":82},"01M72JT3YP1SQHD0MANGDXQ4RT","higgsfield-websites","Build, edit, and deploy full-stack websites, apps and games via the Higgsfield CLI (`higgsfield website …`). Each is a React 19 + TanStack Start SSR app in one Cloudflare Worker (D1\u002FR2\u002FKV\u002FDO\u002FContainers). THREE product types, picked via `--type` on create: `website` (standalone, no Higgsfield integration — references\u002Fwebsite-flow.md), `app` (Sign in with Higgsfield + fnf SDK, Quanta — references\u002Fapp-flow.md), `game` (realtime multiplayer rooms — references\u002Fgame-flow.md). Routes to the right flow; each carries its own rules and deploy\u002Fpublish gates.\nUse when: \"build me a website\", \"make a landing page\", \"create a web app\", \"build a SaaS dashboard \u002F portfolio\", \"make me a game\", \"deploy this site\", \"publish\". Also owns GAME ART: \"make a spritesheet\", \"tileable texture\", \"animate a 3D character\", game music\u002FSFX — see the game-* references.\nNOT for: single image\u002Fvideo\u002Faudio generation (higgsfield-generate), product photos (higgsfield-product-photoshoot), marketplace cards (higgsfield-marketplace-cards).","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fhiggsfield-ai_skills\u002Fhiggsfield-websites\u002FSKILL.md",[],[],"2026-11-10 22:39:42",{"skillNo":84,"name":85,"nameZh":6,"description":86,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":87,"categories":88,"keywords":101,"publishedAt":47},"01M70JPK8HAXXA85P7Q8NKZZYG","writing-skills","Use when creating new skills, editing existing skills, or verifying skills work before deployment","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fobra_superpowers\u002Fwriting-skills\u002FSKILL.md",[89,92,95,98],{"categoryNo":90,"categoryName":91,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000018","写作与文案",{"categoryNo":93,"categoryName":94,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000036","内容创作者",{"categoryNo":96,"categoryName":97,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000008","测试与质量",[102,103,104,105,38,106,107,45,108],"writing","writing skills","editing","deployment","Existing","new","work",{"skillNo":110,"name":111,"nameZh":6,"description":112,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":113,"categories":114,"keywords":120,"publishedAt":47},"01M70JP4PHBH1CQVVDWZ94W159","writing-plans","Use when you have a spec or requirements for a multi-step task, before touching code","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fobra_superpowers\u002Fwriting-plans\u002FSKILL.md",[115,116,117],{"categoryNo":90,"categoryName":91,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":93,"categoryName":94,"taxonomyType":26,"taxonomyTypeDesc":27},{"categoryNo":118,"categoryName":119,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000030","开发工程师",[102,121,122,123,45,124,42,38,125,126,127,128,129],"writing plans","plans","you","code","requirements","task","multi","spec","multi-step task",{"skillNo":131,"name":132,"nameZh":6,"description":133,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":134,"categories":135,"keywords":136,"publishedAt":47},"01M70JNTYVGXFZT8PASZ844TH8","verification-before-completion","Use when about to claim work is complete, fixed, or passing, before committing or creating PRs - requires running verification commands and confirming output before making any success claims; evidence before assertions always","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fobra_superpowers\u002Fverification-before-completion\u002FSKILL.md",[],[137,138,139,140,141,142,38,143,144,145,45,146,108,147,148],"verification","verification before completion","complete","about","output","assertions","prs","evidence","claim","claims","commands","running",{"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":156,"publishedAt":47},"01M70JNGVSQDESWN0Q5BPJ875V","using-superpowers","Use when starting any conversation - establishes how to find and use skills, requiring skill invocation before ANY response including clarifying questions","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fobra_superpowers\u002Fusing-superpowers\u002FSKILL.md",[155],{"categoryNo":96,"categoryName":97,"taxonomyType":21,"taxonomyTypeDesc":22},[157,158,159,160,38,45,161,162,163],"using superpowers","superpowers","conversation","how to","how","find","questions",{"skillNo":165,"name":166,"nameZh":6,"description":167,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":168,"categories":169,"keywords":170,"publishedAt":47},"01M70JN57CE588NPYPYTWH1DWG","using-git-worktrees","Use when starting feature work that needs isolation from current workspace or before executing implementation plans - ensures an isolated workspace exists via native tools or git worktree fallback","https:\u002F\u002Fgithub.com\u002Fmdnaimul22\u002Fhuman-skills\u002Fblob\u002Fmain\u002Fskills\u002Fstorage\u002Fobra_superpowers\u002Fusing-git-worktrees\u002FSKILL.md",[],[171,172,173,174,175,176,45,108,177,178,179,180,181,182,183,122,38,184,185],"using git worktrees","Using git","git","worktrees","git worktrees","implementation","git worktree","worktree","native","Tools","isolation","fallback","feature","via","workspace"]