From shipwright
Create distinctive, production-grade frontend interfaces. Rejects generic AI aesthetics (purple gradients, Inter font, glassmorphism). Design direction first, then implementation.
How this skill is triggered — by the user, by Claude, or both
Slash command
/shipwright:frontend-designopusThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Build frontend that doesn't look like every other AI-generated UI.
Build frontend that doesn't look like every other AI-generated UI.
Most AI-generated UI converges on the same aesthetic: purple gradients, Inter font, glassmorphism cards, excessive rounded corners. This skill deliberately breaks from that pattern.
Design direction comes first. Before writing any code, establish:
Stack: [your framework] + [your UI library] + [your CSS approach]
Design tokens: [your color system, typography, spacing scale]
Component library: [your shared components]
The skill works with any stack. The principles are universal — the implementation details are yours.
/frontend-design # Start design process for a new page/component
Best used for greenfield UI. For wiring data, fixing bugs, or extending existing components, use a standard frontend-dev approach instead.
npx claudepluginhub cloverink/shipwright --plugin shipwrightFetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.
Applies a firm's KYC/AML rules grid to parsed onboarding records: assigns risk rating, checks required documents, outputs rule outcomes with citations, and routes for escalation.
Generates daily or weekly digests of activity from connected sources (chat, email, docs, tasks, CRM), highlighting action items, decisions, mentions, and project updates.