Anti-Slop Landing Page Design

design

Anti-Slop Landing Page Design is a Claude Code skill that makes the model build landing pages, portfolios and redesigns that do not look like typical generated sites. Use it to build a SaaS landing page, assemble a designer portfolio or refresh an old site without breaking the brand. The skill first reads the brief and states its reading in one line: page type, audience, style, design system. It then sets three dials: layout variance, motion intensity and density. Default stack: React or Next.js, Tailwind v4, Motion. If the brief matches Material, Carbon, Fluent, GOV.UK or shadcn, it uses the real package, not hand-made CSS. It bans common tells (three equal cards, purple gradients, default Inter, em dashes, fake div screenshots) and provides GSAP and Motion animation skeletons, dark mode and accessibility rules, a redesign protocol with an audit and a long pre-flight checklist. Not for dashboards or data tables.