Requirements
- Target platform
- OpenClaw
- Install method
- Manual import
- Extraction
- Extract archive
- Prerequisites
- OpenClaw
- Primary doc
- SKILL.md
Tencent SkillHub · Content Creation
Anthropic Frontend Design
Create distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Combines the design intelligence of UI/UX Pro Max with Anthropic's anti-slop philosophy. Use for building UI components, pages, applications, or interfaces with exceptional attention to detail and bold creative choices.
skill openclawclawhub Free
Create distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Combines the design intelligence of UI/UX Pro Max with Anthropic's anti-slop philosophy. Use for building UI components, pages, applications, or interfaces with exceptional attention to detail and bold creative choices.
⬇ 0 downloads ★ 0 stars Unverified but indexed
Install for OpenClaw
Item is unstable.
This item is timing out or returning errors right now. Review the source page and try again later.
Quick setup
- Wait for the source to recover or retry later.
- Review SKILL.md only after the source returns a real package.
- Do not rely on this source for automated install yet.
Package facts
- Download mode
- Manual review
- Package format
- ZIP package
- Source platform
- Tencent SkillHub
- What's included
- assets/data/charts.csv, assets/data/colors.csv, assets/data/icons.csv, assets/data/landing.csv, assets/data/products.csv, assets/data/react-performance.csv
Validation
- Wait for the source to recover or retry later.
- Review SKILL.md only after the download returns a real package.
- Treat this source as transient until the upstream errors clear.
Install with your agent
Agent handoff
Use the source page and any available docs to guide the install because the item is currently unstable or timing out.
- Open the source page via Review source status.
- If you can obtain the package, extract it into a folder your agent can access.
- Paste one of the prompts below and point your agent at the source page and extracted files.
New install
I tried to install a skill package from Yavira, but the item is currently unstable or timing out. Inspect the source page and any extracted docs, then tell me what you can confirm and any manual steps still required.
Upgrade existing
I tried to upgrade a skill package from Yavira, but the item is currently unstable or timing out. Compare the source page and any extracted docs with my current installation, then summarize what changed and what manual follow-up I still need.
Trust & source
Release facts
- Source
- Tencent SkillHub
- Verification
- Indexed source record
- Version
- 1.1.0
Provenance
- Publisher
- Qrucio
- Source page
- View original listing
- Canonical URL
- Open canonical page
Documentation
Anthropic Frontend Design
This skill guides the creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. It integrates structured design intelligence (accessibility, UX rules, stack guidelines) with a bold, intentional aesthetic philosophy.
Core Philosophy: Anti-AI Slop
Claude (and all AI agents) are capable of extraordinary creative work, yet often default to safe, generic patterns. This skill MANDATES breaking those patterns. AVOID: Inter, Roboto, Arial, system fonts, purple-on-white gradients, cookie-cutter SaaS layouts, emojis as icons. MANDATE: Unique typography, context-specific color schemes, intentional motion, unexpected spatial composition, and production-grade functional code.
Design Thinking Process
Before coding, understand the context and commit to a BOLD aesthetic direction: Purpose: What problem does this solve? Who is it for? Tone: Pick an extreme direction—brutally minimal, maximalist chaos, retro-futuristic, organic, luxury, playful, editorial, etc. Intelligence (Reference): Use the internal design tool to gather data (see below). Differentiation: What makes this UNFORGETTABLE?
Design Intelligence Tool
Use the internal search tool to gather palettes, font pairings, and UX guidelines. CRITICAL: You MUST filter the results through the Anti-AI Slop lens. If the tool suggests "Inter" or "Roboto", you are REQUIRED to ignore it and pick a distinctive alternative. # Generate a complete design system python scripts/search.py "<product_type> <industry> <keywords>" --design-system # Search specific domains (style, typography, color, ux, chart, landing) python scripts/search.py "<keyword>" --domain <domain> # Get stack-specific guidelines (html-tailwind, react, nextjs, shadcn, etc.) python scripts/search.py "<keyword>" --stack <stack_name>
1. Professional UI Rules
RuleDoDon'tIconsUse SVG (Heroicons, Lucide, Simple Icons)Use emojis like 🎨 🚀 ⚙️ as UI iconsTypographyBeautiful, unique Google/Custom fontsInter, Roboto, Arial, System fontsHoverStable transitions (color/opacity/shadow)Scale transforms that shift layoutCursorAdd cursor-pointer to all interactive itemsLeave default cursor on buttons/cardsContrastMinimum 4.5:1 for accessibilityLow-contrast "vibes" that are unreadable
2. Motion & Animation
Prioritize CSS-only solutions where possible. Focus on high-impact moments (staggered reveals on page load). Use duration 150-300ms for micro-interactions.
3. Spatial Composition
Use asymmetry, overlap, or diagonal flow to break standard grids. Balance generous negative space OR intentional density.
Pre-Delivery Checklist
Before delivering code, verify every item:
Visual Quality
No emojis used as icons (SVG only). Typography is characterful and NOT "AI standard". Color scheme is unique to the context (no generic gradients). Hover states provide clear, stable visual feedback.
UX & Accessibility
All interactive elements have cursor-pointer. Form inputs have labels; images have alt text. Text contrast meets 4.5:1 minimum (test Light/Dark modes). Responsive at all breakpoints (375px, 768px, 1024px, 1440px). No horizontal scroll on mobile.
Aesthetic Directions (Reference)
Brutally Minimal: Monochrome, extreme white space, sparse typography. Maximalist Chaos: Overlapping elements, dense information, pattern mixing. Retro-Futuristic: Chrome effects, neon accents, 80s-inspired. Luxury/Refined: Gold/Dark accents, serif fonts, generous spacing. Playful/Toy-like: Rounded corners, bright pastels, bouncy animations. Editorial/Magazine: Grid-based, bold headlines, clean hierarchy. Brutalist/Raw: Monospace fonts, harsh contrasts, industrial. Art Deco: Sharp angles, metallic accents, ornate borders. Commit to ONE direction and execute it fully—no half measures.
Category context
Writing, remixing, publishing, visual generation, and marketing content production.
Source: Tencent SkillHub
Largest current source with strong distribution and engagement signals.
Package contents
Included in package
6 Assets
- assets/data/charts.csv
- assets/data/colors.csv
- assets/data/icons.csv
- assets/data/landing.csv
- assets/data/products.csv
- assets/data/react-performance.csv