{"id":"ee12f2ce-d616-4f52-ade8-55c6791cfe9d","entityType":"agent","slug":"clawhub-mpociot-superdesign-erdesign-2","name":"SuperDesign","canonicalUrl":"https://www.xpersona.co/agent/clawhub-mpociot-superdesign-erdesign-2","canonicalPath":"/agent/clawhub-mpociot-superdesign-erdesign-2","generatedAt":"2026-11-13T06:00:33.481Z","source":"CLAWHUB","claimStatus":"UNCLAIMED","verificationTier":"NONE","summary":{"evidence":{"source":"editorial-content","verified":true,"confidence":"high","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":null},"description":"Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Skill: SuperDesign Owner: mpociot Summary: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Tags: latest:1.0.0 Version history: v1.0.0 | 2026-01-06T17:04:34.735Z | user Frontend design guidelines based on SuperDesign patterns Archive index: Archive v1.0.0: 3 files, 4013 bytes Files: skill-card.md (1664b), SKILL.md (6178b), _meta.","descriptionLabel":"Technical summary","evidenceSummary":"Capability contract not published. No trust telemetry is available yet. 42.8K downloads reported by the source. Last updated 11/11/2026.","installCommand":"clawhub skill install s170f0j0qrjftk5522nedp44qh884efe:superdesign","sourceUrl":"https://clawhub.ai/mpociot/superdesign","homepage":"https://clawhub.ai/mpociot/skills/superdesign","primaryLinks":[{"label":"View on ClawHub","url":"https://clawhub.ai/mpociot/superdesign","kind":"source"},{"label":"Homepage","url":"https://clawhub.ai/mpociot/skills/superdesign","kind":"homepage"}],"safetyScore":84,"overallRank":62,"popularityScore":93,"trustScore":null,"claimedByName":null,"isOwner":false,"seoDescription":"Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Skill: SuperDesign Own"},"coverage":{"evidence":{"source":"public-profile","verified":false,"confidence":"medium","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":null},"protocols":[{"protocol":"OPENCLEW","label":"OpenClaw","status":"self-declared","notes":"Declared in the public agent profile."}],"capabilities":[],"verifiedCount":0,"selfDeclaredCount":1,"capabilityMatrix":{"rows":[{"key":"OPENCLEW","type":"protocol","support":"unknown","confidenceSource":"profile","notes":"Listed on profile"}],"flattenedTokens":"protocol:OPENCLEW|unknown|profile"}},"adoption":{"evidence":{"source":"CLAWHUB","verified":false,"confidence":"medium","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":null},"stars":null,"forks":null,"downloads":42833,"likes":null,"task":null,"library":null,"packageName":null,"latestVersion":"1.0.0","tractionLabel":"42.8K downloads"},"release":{"evidence":{"source":"CLAWHUB","verified":false,"confidence":"medium","updatedAt":"2026-11-11T17:16:41.527Z","emptyReason":null},"lastUpdatedAt":"2026-11-11T17:16:41.542Z","lastCrawledAt":"2026-11-11T17:16:41.527Z","lastIndexedAt":null,"nextCrawlAt":"2026-11-12T17:16:41.527Z","lastVerifiedAt":null,"highlights":[{"version":"1.0.0","createdAt":"2026-01-06T17:04:34.735Z","changelog":"Frontend design guidelines based on SuperDesign patterns","fileCount":3,"zipByteSize":4013}]},"execution":{"evidence":{"source":"CLAWHUB","verified":false,"confidence":"low","updatedAt":null,"emptyReason":"No published capability contract is available yet."},"installCommand":"clawhub skill install s170f0j0qrjftk5522nedp44qh884efe:superdesign","setupComplexity":"low","setupSteps":["Setup complexity is LOW. This package is likely designed for quick installation with minimal external side-effects.","Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data."],"contract":{"contractStatus":"missing","authModes":[],"requires":[],"forbidden":[],"supportsMcp":false,"supportsA2a":false,"supportsStreaming":false,"inputSchemaRef":null,"outputSchemaRef":null,"dataRegion":null,"contractUpdatedAt":null,"sourceUpdatedAt":null,"freshnessSeconds":null},"invocationGuide":{"preferredApi":{"snapshotUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/snapshot","contractUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/contract","trustUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/trust"},"curlExamples":["curl -s \"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/snapshot\"","curl -s \"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/contract\"","curl -s \"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/trust\""],"jsonRequestTemplate":{"query":"summarize this repo","constraints":{"maxLatencyMs":2000,"protocolPreference":["OPENCLEW"]}},"jsonResponseTemplate":{"ok":true,"result":{"summary":"...","confidence":0.9},"meta":{"source":"CLAWHUB","generatedAt":"2026-11-13T06:00:33.481Z"}},"retryPolicy":{"maxAttempts":3,"backoffMs":[500,1500,3500],"retryableConditions":["HTTP_429","HTTP_503","NETWORK_TIMEOUT"]}},"endpoints":{"dossierUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/dossier","snapshotUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/snapshot","contractUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/contract","trustUrl":"https://www.xpersona.co/api/v1/agents/clawhub-mpociot-superdesign-erdesign-2/trust"}},"reliability":{"evidence":{"source":"runtime-metrics","verified":false,"confidence":"low","updatedAt":null,"emptyReason":"No trust, reliability, or runtime telemetry is available."},"trust":{"status":"unavailable","handshakeStatus":"UNKNOWN","verificationFreshnessHours":null,"reputationScore":null,"p95LatencyMs":null,"successRate30d":null,"fallbackRate":null,"attempts30d":null,"trustUpdatedAt":null,"trustConfidence":"unknown","sourceUpdatedAt":null,"freshnessSeconds":null},"decisionGuardrails":{"doNotUseIf":["Contract metadata is missing or unavailable for deterministic execution."],"safeUseWhen":[],"riskFlags":["missing_or_unavailable_contract","trust_data_unavailable","schema_references_missing"],"operationalConfidence":"low"},"executionMetrics":{"observedLatencyMsP50":null,"observedLatencyMsP95":null,"estimatedCostUsd":null,"uptime30d":null,"rateLimitRpm":null,"rateLimitBurst":null,"lastVerifiedAt":null,"verificationSource":null},"runtimeMetrics":{"successRate":null,"avgLatencyMs":null,"avgCostUsd":null,"hallucinationRate":null,"retryRate":null,"disputeRate":null,"p50Latency":null,"p95Latency":null,"lastUpdated":null}},"benchmarks":{"evidence":{"source":"no-benchmark-data","verified":false,"confidence":"low","updatedAt":null,"emptyReason":"No benchmark suites or observed failure patterns are available."},"suites":[],"failurePatterns":[]},"artifacts":{"evidence":{"source":"CLAWHUB","verified":false,"confidence":"high","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":null},"readme":"Skill: SuperDesign\n\nOwner: mpociot\n\nSummary: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.\n\nTags: latest:1.0.0\n\nVersion history:\n\nv1.0.0 | 2026-01-06T17:04:34.735Z | user\n\nFrontend design guidelines based on SuperDesign patterns\n\nArchive index:\n\nArchive v1.0.0: 3 files, 4013 bytes\n\nFiles: skill-card.md (1664b), SKILL.md (6178b), _meta.json (130b)\n\nFile v1.0.0:SKILL.md\n\n---\nname: frontend-design\ndescription: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.\nmetadata: {\"clawdbot\":{\"emoji\":\"🎨\"}}\n---\n\n# Frontend Design Skill\n\nUse this skill when creating UI components, landing pages, dashboards, or any frontend design work.\n\n## Design Workflow\n\nFollow this structured approach for UI design:\n\n1. **Layout Design** — Think through component structure, create ASCII wireframes\n2. **Theme Design** — Define colors, fonts, spacing, shadows\n3. **Animation Design** — Plan micro-interactions and transitions\n4. **Implementation** — Generate the actual code\n\n### 1. Layout Design\n\nBefore coding, sketch the layout in ASCII format:\n\n```\n┌─────────────────────────────────────┐\n│         HEADER / NAV BAR            │\n├─────────────────────────────────────┤\n│                                     │\n│            HERO SECTION             │\n│         (Title + CTA)               │\n│                                     │\n├─────────────────────────────────────┤\n│   FEATURE   │  FEATURE  │  FEATURE  │\n│     CARD    │   CARD    │   CARD    │\n├─────────────────────────────────────┤\n│            FOOTER                   │\n└─────────────────────────────────────┘\n```\n\n### 2. Theme Guidelines\n\n**Color Rules:**\n- NEVER use generic bootstrap-style blue (#007bff) — it looks dated\n- Prefer oklch() for modern color definitions\n- Use semantic color variables (--primary, --secondary, --muted, etc.)\n- Consider both light and dark mode from the start\n\n**Font Selection (Google Fonts):**\n```\nSans-serif: Inter, Roboto, Poppins, Montserrat, Outfit, Plus Jakarta Sans, DM Sans, Space Grotesk\nMonospace: JetBrains Mono, Fira Code, Source Code Pro, IBM Plex Mono, Space Mono, Geist Mono\nSerif: Merriweather, Playfair Display, Lora, Source Serif Pro, Libre Baskerville\nDisplay: Architects Daughter, Oxanium\n```\n\n**Spacing & Shadows:**\n- Use consistent spacing scale (0.25rem base)\n- Shadows should be subtle — avoid heavy drop shadows\n- Consider using oklch() for shadow colors too\n\n### 3. Theme Patterns\n\n**Modern Dark Mode (Vercel/Linear style):**\n```css\n:root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0.145 0 0);\n  --primary: oklch(0.205 0 0);\n  --primary-foreground: oklch(0.985 0 0);\n  --secondary: oklch(0.970 0 0);\n  --muted: oklch(0.970 0 0);\n  --muted-foreground: oklch(0.556 0 0);\n  --border: oklch(0.922 0 0);\n  --radius: 0.625rem;\n  --font-sans: Inter, system-ui, sans-serif;\n}\n```\n\n**Neo-Brutalism (90s web revival):**\n```css\n:root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0 0 0);\n  --primary: oklch(0.649 0.237 26.97);\n  --secondary: oklch(0.968 0.211 109.77);\n  --accent: oklch(0.564 0.241 260.82);\n  --border: oklch(0 0 0);\n  --radius: 0px;\n  --shadow: 4px 4px 0px 0px hsl(0 0% 0%);\n  --font-sans: DM Sans, sans-serif;\n  --font-mono: Space Mono, monospace;\n}\n```\n\n**Glassmorphism:**\n```css\n.glass {\n  background: rgba(255, 255, 255, 0.1);\n  backdrop-filter: blur(10px);\n  border: 1px solid rgba(255, 255, 255, 0.2);\n  border-radius: 1rem;\n}\n```\n\n### 4. Animation Guidelines\n\n**Micro-syntax for planning:**\n```\nbutton: 150ms [S1→0.95→1] press\nhover: 200ms [Y0→-2, shadow↗]\nfadeIn: 400ms ease-out [Y+20→0, α0→1]\nslideIn: 350ms ease-out [X-100→0, α0→1]\nbounce: 600ms [S0.95→1.05→1]\n```\n\n**Common patterns:**\n- Entry animations: 300-500ms, ease-out\n- Hover states: 150-200ms\n- Button press: 100-150ms\n- Page transitions: 300-400ms\n\n### 5. Implementation Rules\n\n**Tailwind CSS:**\n```html\n<!-- Import via CDN for prototypes -->\n<script src=\"https://cdn.tailwindcss.com\"></script>\n```\n\n**Flowbite (component library):**\n```html\n<link href=\"https://cdn.jsdelivr.net/npm/flowbite@2.0.0/dist/flowbite.min.css\" rel=\"stylesheet\">\n<script src=\"https://cdn.jsdelivr.net/npm/flowbite@2.0.0/dist/flowbite.min.js\"></script>\n```\n\n**Icons (Lucide):**\n```html\n<script src=\"https://unpkg.com/lucide@latest/dist/umd/lucide.min.js\"></script>\n<script>lucide.createIcons();</script>\n```\n\n**Images:**\n- Use real placeholder services: Unsplash, placehold.co\n- Never make up image URLs\n- Example: `https://images.unsplash.com/photo-xxx?w=800&h=600`\n\n### 6. Responsive Design\n\nAlways design mobile-first and responsive:\n\n```css\n/* Mobile first */\n.container { padding: 1rem; }\n\n/* Tablet */\n@media (min-width: 768px) {\n  .container { padding: 2rem; }\n}\n\n/* Desktop */\n@media (min-width: 1024px) {\n  .container { max-width: 1200px; margin: 0 auto; }\n}\n```\n\n### 7. Accessibility\n\n- Use semantic HTML (header, main, nav, section, article)\n- Include proper heading hierarchy (h1 → h2 → h3)\n- Add aria-labels to interactive elements\n- Ensure sufficient color contrast (4.5:1 minimum)\n- Support keyboard navigation\n\n### 8. Component Design Tips\n\n**Cards:**\n- Subtle shadows, not heavy drop shadows\n- Consistent padding (p-4 to p-6)\n- Hover state: slight lift + shadow increase\n\n**Buttons:**\n- Clear visual hierarchy (primary, secondary, ghost)\n- Adequate touch targets (min 44x44px)\n- Loading and disabled states\n\n**Forms:**\n- Clear labels above inputs\n- Visible focus states\n- Inline validation feedback\n- Adequate spacing between fields\n\n**Navigation:**\n- Sticky header for long pages\n- Clear active state indication\n- Mobile-friendly hamburger menu\n\n---\n\n## Quick Reference\n\n| Element | Recommendation |\n|---------|---------------|\n| Primary font | Inter, Outfit, DM Sans |\n| Code font | JetBrains Mono, Fira Code |\n| Border radius | 0.5rem - 1rem (modern), 0 (brutalist) |\n| Shadow | Subtle, 1-2 layers max |\n| Spacing | 4px base unit (0.25rem) |\n| Animation | 150-400ms, ease-out |\n| Colors | oklch() for modern, avoid generic blue |\n\n---\n\n*Based on SuperDesign patterns — https://superdesign.dev*\n\nFile v1.0.0:_meta.json\n\n{\n  \"ownerId\": \"kn79bhw9e6awqnf5v5y0ybsncd7ynfvp\",\n  \"slug\": \"superdesign\",\n  \"version\": \"1.0.0\",\n  \"publishedAt\": 1767719074735\n}\n\nFile v1.0.0:skill-card.md\n\n## Description:\n\nExpert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.\n\nThis skill is ready for commercial/non-commercial use.\n\n## Publisher:\n\n[mpociot](https://clawhub.ai/user/mpociot)\n\n### License/Terms of Use:\n\n\n## Use Case:\n\nDevelopers and designers use this skill to plan and implement frontend interfaces, including landing pages, dashboards, UI components, responsive layouts, themes, animations, and accessibility details.\n\n### Deployment Geography for Use:\n\nGlobal\n\n## Known Risks and Mitigations:\n\nRisk: Prototype CDN snippets can create supply-chain risk if copied directly into production projects.\n\nMitigation: For production, use locked package dependencies, pinned versions, bundled assets, or SRI-protected CDN resources.\n\n## Reference(s):\n\n- [ClawHub SuperDesign Skill](https://clawhub.ai/mpociot/skills/superdesign)\n- [SuperDesign](https://superdesign.dev)\n\n## Skill Output:\n\n**Output Type(s):** [guidance, markdown, code, configuration]\n\n**Output Format:** [Markdown guidance with example HTML, CSS, and configuration snippets]\n\n**Output Parameters:** [1D]\n\n**Other Properties Related to Output:** [May include frontend implementation recommendations, responsive design guidance, accessibility checks, and prototype CDN snippets.]\n\n## Skill Version(s):\n\n1.0.0 (source: server release metadata)\n\n## Ethical Considerations:\n\nUsers should evaluate whether this skill is appropriate for their environment, review any generated or modified files before relying on them, and apply their organization's safety, security, and compliance requirements before deployment.","readmeExcerpt":"Skill: SuperDesign Owner: mpociot Summary: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Tags: latest:1.0.0 Version history: v1.0.0 | 2026-01-06T17:04:34.735Z | user Frontend design guidelines based on SuperDesign patterns Archive index: Archive v1.0.0: 3 files, 4013 bytes Files: skill-card.md (1664b), SKILL.md (6178b), _meta.","codeSnippets":[],"executableExamples":[{"language":"text","snippet":"┌─────────────────────────────────────┐\n│         HEADER / NAV BAR            │\n├─────────────────────────────────────┤\n│                                     │\n│            HERO SECTION             │\n│         (Title + CTA)               │\n│                                     │\n├─────────────────────────────────────┤\n│   FEATURE   │  FEATURE  │  FEATURE  │\n│     CARD    │   CARD    │   CARD    │\n├─────────────────────────────────────┤\n│            FOOTER                   │\n└─────────────────────────────────────┘"},{"language":"text","snippet":"Sans-serif: Inter, Roboto, Poppins, Montserrat, Outfit, Plus Jakarta Sans, DM Sans, Space Grotesk\nMonospace: JetBrains Mono, Fira Code, Source Code Pro, IBM Plex Mono, Space Mono, Geist Mono\nSerif: Merriweather, Playfair Display, Lora, Source Serif Pro, Libre Baskerville\nDisplay: Architects Daughter, Oxanium"},{"language":"css","snippet":":root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0.145 0 0);\n  --primary: oklch(0.205 0 0);\n  --primary-foreground: oklch(0.985 0 0);\n  --secondary: oklch(0.970 0 0);\n  --muted: oklch(0.970 0 0);\n  --muted-foreground: oklch(0.556 0 0);\n  --border: oklch(0.922 0 0);\n  --radius: 0.625rem;\n  --font-sans: Inter, system-ui, sans-serif;\n}"},{"language":"css","snippet":":root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0 0 0);\n  --primary: oklch(0.649 0.237 26.97);\n  --secondary: oklch(0.968 0.211 109.77);\n  --accent: oklch(0.564 0.241 260.82);\n  --border: oklch(0 0 0);\n  --radius: 0px;\n  --shadow: 4px 4px 0px 0px hsl(0 0% 0%);\n  --font-sans: DM Sans, sans-serif;\n  --font-mono: Space Mono, monospace;\n}"},{"language":"css","snippet":".glass {\n  background: rgba(255, 255, 255, 0.1);\n  backdrop-filter: blur(10px);\n  border: 1px solid rgba(255, 255, 255, 0.2);\n  border-radius: 1rem;\n}"},{"language":"text","snippet":"button: 150ms [S1→0.95→1] press\nhover: 200ms [Y0→-2, shadow↗]\nfadeIn: 400ms ease-out [Y+20→0, α0→1]\nslideIn: 350ms ease-out [X-100→0, α0→1]\nbounce: 600ms [S0.95→1.05→1]"}],"parameters":null,"dependencies":[],"permissions":[],"extractedFiles":[{"path":"SKILL.md","content":"---\nname: frontend-design\ndescription: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.\nmetadata: {\"clawdbot\":{\"emoji\":\"🎨\"}}\n---\n\n# Frontend Design Skill\n\nUse this skill when creating UI components, landing pages, dashboards, or any frontend design work.\n\n## Design Workflow\n\nFollow this structured approach for UI design:\n\n1. **Layout Design** — Think through component structure, create ASCII wireframes\n2. **Theme Design** — Define colors, fonts, spacing, shadows\n3. **Animation Design** — Plan micro-interactions and transitions\n4. **Implementation** — Generate the actual code\n\n### 1. Layout Design\n\nBefore coding, sketch the layout in ASCII format:\n\n```\n┌─────────────────────────────────────┐\n│         HEADER / NAV BAR            │\n├─────────────────────────────────────┤\n│                                     │\n│            HERO SECTION             │\n│         (Title + CTA)               │\n│                                     │\n├─────────────────────────────────────┤\n│   FEATURE   │  FEATURE  │  FEATURE  │\n│     CARD    │   CARD    │   CARD    │\n├─────────────────────────────────────┤\n│            FOOTER                   │\n└─────────────────────────────────────┘\n```\n\n### 2. Theme Guidelines\n\n**Color Rules:**\n- NEVER use generic bootstrap-style blue (#007bff) — it looks dated\n- Prefer oklch() for modern color definitions\n- Use semantic color variables (--primary, --secondary, --muted, etc.)\n- Consider both light and dark mode from the start\n\n**Font Selection (Google Fonts):**\n```\nSans-serif: Inter, Roboto, Poppins, Montserrat, Outfit, Plus Jakarta Sans, DM Sans, Space Grotesk\nMonospace: JetBrains Mono, Fira Code, Source Code Pro, IBM Plex Mono, Space Mono, Geist Mono\nSerif: Merriweather, Playfair Display, Lora, Source Serif Pro, Libre Baskerville\nDisplay: Architects Daughter, Oxanium\n```\n\n**Spacing & Shadows:**\n- Use consistent spacing scale (0.25rem base)\n- Shadows should be subtle — avoid heavy drop shadows\n- Consider using oklch() for shadow colors too\n\n### 3. Theme Patterns\n\n**Modern Dark Mode (Vercel/Linear style):**\n```css\n:root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0.145 0 0);\n  --primary: oklch(0.205 0 0);\n  --primary-foreground: oklch(0.985 0 0);\n  --secondary: oklch(0.970 0 0);\n  --muted: oklch(0.970 0 0);\n  --muted-foreground: oklch(0.556 0 0);\n  --border: oklch(0.922 0 0);\n  --radius: 0.625rem;\n  --font-sans: Inter, system-ui, sans-serif;\n}\n```\n\n**Neo-Brutalism (90s web revival):**\n```css\n:root {\n  --background: oklch(1 0 0);\n  --foreground: oklch(0 0 0);\n  --primary: oklch(0.649 0.237 26.97);\n  --secondary: oklch(0.968 0.211 109.77);\n  --accent: oklch(0.564 0.241 260.82);\n  --border: oklch(0 0 0);\n  --radius: 0px;\n  --shadow: 4px 4px 0px 0px hsl(0 0% 0%);\n  --font-sans: DM Sans, sans-serif;\n  --font-mono: Space Mono, monospace;\n}\n```\n\n**Glassmorphism:**\n```css\n.glass {\n  background: rgba(255, 255, 255, 0.1);\n  backdrop-filter: blur"},{"path":"_meta.json","content":"{\n  \"ownerId\": \"kn79bhw9e6awqnf5v5y0ybsncd7ynfvp\",\n  \"slug\": \"superdesign\",\n  \"version\": \"1.0.0\",\n  \"publishedAt\": 1767719074735\n}"},{"path":"skill-card.md","content":"## Description:\n\nExpert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.\n\nThis skill is ready for commercial/non-commercial use.\n\n## Publisher:\n\n[mpociot](https://clawhub.ai/user/mpociot)\n\n### License/Terms of Use:\n\n\n## Use Case:\n\nDevelopers and designers use this skill to plan and implement frontend interfaces, including landing pages, dashboards, UI components, responsive layouts, themes, animations, and accessibility details.\n\n### Deployment Geography for Use:\n\nGlobal\n\n## Known Risks and Mitigations:\n\nRisk: Prototype CDN snippets can create supply-chain risk if copied directly into production projects.\n\nMitigation: For production, use locked package dependencies, pinned versions, bundled assets, or SRI-protected CDN resources.\n\n## Reference(s):\n\n- [ClawHub SuperDesign Skill](https://clawhub.ai/mpociot/skills/superdesign)\n- [SuperDesign](https://superdesign.dev)\n\n## Skill Output:\n\n**Output Type(s):** [guidance, markdown, code, configuration]\n\n**Output Format:** [Markdown guidance with example HTML, CSS, and configuration snippets]\n\n**Output Parameters:** [1D]\n\n**Other Properties Related to Output:** [May include frontend implementation recommendations, responsive design guidance, accessibility checks, and prototype CDN snippets.]\n\n## Skill Version(s):\n\n1.0.0 (source: server release metadata)\n\n## Ethical Considerations:\n\nUsers should evaluate whether this skill is appropriate for their environment, review any generated or modified files before relying on them, and apply their organization's safety, security, and compliance requirements before deployment."}],"languages":[],"docsSourceLabel":"CLAWHUB","editorialOverview":"Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Skill: SuperDesign Owner: mpociot Summary: Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface. Tags: latest:1.0.0 Version history: v1.0.0 | 2026-01-06T17:04:34.735Z | user Frontend design guidelines based on SuperDesign patterns Archive index: Archive v1.0.0: 3 files, 4013 bytes Files: skill-card.md (1664b), SKILL.md (6178b), _meta.","editorialQuality":{"score":100,"threshold":65,"status":"ready","wordCount":752,"uniquenessScore":62,"reasons":[]}},"media":{"evidence":{"source":"no-media","verified":false,"confidence":"low","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":"No screenshots, media assets, or demo links are available."},"primaryImageUrl":null,"mediaAssetCount":0,"assets":[],"demoUrl":null},"ownerResources":{"evidence":{"source":"unclaimed","verified":false,"confidence":"low","updatedAt":"2026-11-11T17:16:41.542Z","emptyReason":"This page has not been claimed by the agent owner."},"hasCustomPage":false,"customPageUpdatedAt":null,"customLinks":[],"structuredLinks":{"docsUrl":null,"demoUrl":null,"supportUrl":null,"pricingUrl":null,"statusUrl":null},"customPage":null},"relatedAgents":{"evidence":{"source":"protocol-neighbors","verified":false,"confidence":"medium","updatedAt":"2026-11-13T06:00:33.481Z","emptyReason":null},"items":[{"id":"8ebccd8e-3863-4187-8355-c3f14e1f9edf","entityType":"agent","canonicalPath":"/agent/iofficeai-aionui","slug":"iofficeai-aionui","name":"AionUi","description":"Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!","url":"https://github.com/iOfficeAI/AionUi","homepage":"https://www.aionui.com","source":"GITHUB_REPOS","protocols":["MCP","OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-10-09T19:11:12.944Z","createdAt":"2026-02-25T03:38:16.584Z","downloads":null},{"id":"b917f68a-ebff-438e-84f8-3f4b2494c0bc","entityType":"agent","canonicalPath":"/agent/activepieces-activepieces","slug":"activepieces-activepieces","name":"activepieces","description":"AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents","url":"https://github.com/activepieces/activepieces","homepage":"https://www.activepieces.com","source":"GITHUB_REPOS","protocols":["OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-04-15T02:22:12.426Z","createdAt":"2026-02-25T03:38:12.412Z","downloads":null},{"id":"5cb26759-3a39-483f-94cf-276a98c13bb8","entityType":"agent","canonicalPath":"/agent/cherryhq-cherry-studio","slug":"cherryhq-cherry-studio","name":"cherry-studio","description":"AI productivity studio with smart chat, autonomous agents, and 300+ assistants. Unified access to frontier LLMs","url":"https://github.com/CherryHQ/cherry-studio","homepage":"https://cherry-ai.com","source":"GITHUB_REPOS","protocols":["MCP","OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-04-11T14:38:40.986Z","createdAt":"2026-02-25T03:38:19.379Z","downloads":null},{"id":"6f6582d0-5d76-4f0f-b81d-86520247950b","entityType":"agent","canonicalPath":"/agent/copilotkit-copilotkit","slug":"copilotkit-copilotkit","name":"CopilotKit","description":"The Frontend for Agents & Generative UI. React + Angular","url":"https://github.com/CopilotKit/CopilotKit","homepage":"https://docs.copilotkit.ai","source":"GITHUB_REPOS","protocols":["OPENCLAW"],"capabilities":[],"safetyScore":100,"overallRank":70,"updatedAt":"2026-03-25T09:50:57.846Z","createdAt":"2026-02-25T03:39:14.617Z","downloads":null}],"links":{"hub":"/agent","source":"/agent/source/clawhub","protocols":[{"label":"OpenClaw","href":"/agent/protocol/openclew"}]}}}