Communitygithub.com

design-inspo

Finden Sie Designinspiration aus kuratierten Galerie-Seiten. Verwenden Sie es, wenn ein Benutzer UI/UX-Referenzen, Designbeispiele oder Inspiration für bestimmte Komponenten (Navbars, CTAs, Hero-Sektionen, Landing Pages usw.), vollständige Websites, SaaS-Produkte, mobile Apps, Animationen, Icons, Branding oder Designsysteme benötigt. Hilft bei der Auswahl der richtigen Inspirationsquelle und beim Durchstöbern von Beispielen.

Was ist design-inspo?

Diese Fähigkeit leitet Designrecherchen an die am besten geeignete kuratierte Galerie weiter, basierend auf den spezifischen Anforderungen des Benutzers. Sie ist ideal für Entwickler und Designer, die visuelle Referenzen für UI-Komponenten, vollständige Seitenlayouts, mobile Apps, Animationen und Branding-Elemente suchen. Die Fähigkeit unterstützt eine Vielzahl von Plattformen, darunter Claude Code, Cursor und Codex, und bietet eine schnelle Nachschlagetabelle mit über einem Dutzend spezialisierter Galerie-Seiten wie curated.design für allgemeines Webdesign, landing.love für Landing Pages und component.gallery für Designsysteme. Sie funktioniert, indem sie das benötigte Designelement identifiziert, 1–3 relevante Seiten empfiehlt, den Browser zur Navigation und Aufnahme von Beispielen verwendet und bei Bedarf mehrere Galerien für vollständige Seiten, spezifische Komponenten oder mobile-first Designs kombiniert.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/unisone/openclaw-skill-suite/tree/main/skills/design-inspo

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Design Inspiration

Leiten Sie die Designrecherche an die richtige kuratierte Galerie weiter, basierend auf den Bedürfnissen des Benutzers.

Schnellübersicht

BedarfSeiteURL
Webdesign (allgemein)Curated Designcurated.design
Landing PagesLanding Lovelanding.love
SaaS-WebsitesSaasposaaspo.com
Navbars / NavigationNavbar Gallerynavbar.gallery
CTA-BereicheCTA Gallerycta.gallery
Animationen / BewegungApp Motionappmotion.design
Mobile Apps (iOS/Web)Mobbinmobbin.com
Rebrands / BrandingRebrand Galleryrebrand.gallery
IconsHuge Iconshugeicons.com
Designsysteme / KomponentenComponent Gallerycomponent.gallery
Hero-BereicheHero Captureherocapture.com
3D-IconsIcoonicoon.co

Verwendung

  1. Identifizieren Sie das Designelement, für das der Benutzer Inspiration benötigt
  2. Empfehlen Sie 1–3 Seiten aus dem obigen Katalog (möglichst spezifisch zuerst)
  3. Öffnen Sie die Seite über das Browser-Tool, wenn der Benutzer Live-Beispiele durchstöbern möchte
  4. Machen Sie Screenshots von bestimmten Beispielen, wenn der Benutzer visuelle Referenzen gespeichert haben möchte

Seiten durchstöbern

Verwenden Sie das Browser-Tool, um durch Galerien zu navigieren und Screenshots zu machen:

browser → navigieren Sie zur Seiten-URL
browser → Snapshot, um Beispiele zu finden
browser → Screenshot, um bestimmte Designs festzuhalten

Für Mobbin (erfordert Konto für vollen Zugriff), Navbar Gallery und Component Gallery – diese haben strukturierte Kategorien, die über ihre Seitenleiste/Filter-UI durchsucht werden können.

Wenn mehrere Seiten zutreffen

  • Komplettes Seitenlayout → curated.design + landing.love
  • Bestimmte Komponente → navbar.gallery / cta.gallery / component.gallery
  • Mobile-first → mobbin.com
  • Bewegung/Interaktion → appmotion.design (falls verfügbar) + landing.love (hat Videoaufnahmen)
  • Markenidentität → rebrand.gallery
  • Iconsuche → hugeicons.com (2D) + icoon.co (3D)

Erweiterter Katalog

Für zusätzliche Seiten und detaillierte Beschreibungen siehe references/catalog.md.

Individual skills in this repo

This repo contains 10 individual skills — each has its own dedicated page.

astra-operator

Delegate computer-use and browser tasks to OpenAI

graphrag

Build a GraphRAG pipeline over documents. Use when plain vector search returns chunks without connections, when questions need multi-hop reasoning (

mundane-demos

Demo strategy that leads with mundane real-life utility instead of benchmarks. Use when presenting an AI agent or product to non-technical audiences. Covers picking tasks the viewer did this morning, showing end-to-end completion, and letting speed be the wow factor.

release-notes

Generate polished release notes from git history. Use when cutting a release, before publishing a GitHub release, or when you need a changelog from commits between two tags. Groups changes by type, surfaces breaking changes, and drafts highlights.

remotion-product-demos

Create Apple-keynote-quality product demo videos with Remotion. Covers glass phone mockups, floating 3D spheres, typing animations, card UIs, ripple effects, and smooth scene transitions. Use when asked to create product demos, app showcase videos, UI walkthrough animations, or

repo-security-scan

Scan a repository for high-signal security issues and produce a report. Use when auditing a codebase for leaked secrets or vulnerable dependencies, before a release, or when onboarding an unfamiliar repo. Runs gitleaks secret scanning and osv-scanner dependency checks.

secure-agent-design

Security architecture patterns for personal AI agents that touch real accounts. Use when designing an agent with access to inbox, calendar, finances, or shopping. Covers per-user isolated VMs, pre-action sentinel checks, least-privilege connectors, human approval gates, and single-use payment credentials.

testimonial-launch

Turn user testimonials into launch distribution. Use when launching a product or feature and you want real user proof to carry the announcement instead of marketing copy. Covers soliciting specific testimonials, curating them, and amplifying via quote-posts.

unisone/openclaw-skill-suite

Create Apple-keynote-quality product demo videos with Remotion. Covers glass phone mockups, floating 3D spheres, typing animations, card UIs, ripple effects, and smooth scene transitions. Use when asked to create product demos, app showcase videos, UI walkthrough animations, or

validator-quotes

Earn and deploy third-party validator quotes for a launch. Use when you need credibility beyond your own claims. Covers who to approach, how to get honest reactions, and how to amplify them via quote-posts, based on the founder/CEO validators behind the Muse launch.

Verwandte Skills